/* ============================================================
   Chu Kỳ Vàng — style.css
   Phần :root bên dưới là bộ token dùng chung với dashboard quỹ.
   Muốn đổi toàn bộ tông màu thì chỉ sửa ở đây.

   BẢN SỬA FILE NÀY: #139 — 2026-10-25 — GỌN GIAO DIỆN VÒNG 2 («b6b6ef07», anh gật 24/10 "ok e làm đi"): khối mới CUỐI FILE — màu xen kẽ đậm 3,5→7 %,
     MỌI bảng không xuống dòng trong một hàng (dòng phụ tên đứng cạnh tên, % đứng cạnh số tiền, bảng rộng thì cuộn ngang), ⛶ ba bảng bung KÍN màn
     (inset 0, bỏ bo góc + bóng, y biểu đồ nến), ẩn phần đầu tab Giao dịch / Chẩn đoán / Dữ liệu thị trường, khung biểu đồ khỏi nhảy lúc mới mở. Đi cặp index #341 + React fundTable.ts (tỷ / tr).
   BẢN SỬA TRƯỚC: #138 — 2026-10-25 — GỌN GIAO DIỆN TOÀN TRANG («b6b6ef07», anh gật 24/10 "rồi e làm đi"): khối mới CUỐI FILE — thanh trên 71→54px,
     khung bảng + biểu đồ `--khu-h` cao theo màn (trần 758, sàn 440), tab ↔ khung sát lại, thẻ USDT Markup cùng khuôn biểu đồ coin, màu xen kẽ hàng mọi bảng,
     đệm ô bảng nhỏ lại, vạch CKV30 chỉ ô đầu, icon đăng xuất 18px. Đi cặp index #340 + React (be/FE UsdtMarkupCard / UsdtMarkupChart).
   BẢN SỬA TRƯỚC: #137 — 2026-10-18 — MÀN HẸP BỎ LUÔN NÚT GÓC "ĐĂNG NHẬP" Ở MÀN TẠO TÀI KHOẢN («1a99ed8f», anh duyệt 18/10 "trên điện thoại thôi"):
     luật #136 trong @media ≤ 860px ẩn thêm `#dnTopDangNhap` (vẫn còn dòng "Đã có tài khoản? Đăng nhập" trong thẻ). Máy tính giữ nguyên. Đi cặp index #320.
   (Dòng #136 — MÀN ĐĂNG NHẬP: NÚT GOOGLE KIỂU CHUẨN — bỏ khỏi header 25/10 cho đủ 3 bản.)
   (Dòng #135 — THƯỞNG GIỚI THIỆU ĐỢT 3 — bỏ khỏi header 25/10 cho đủ 3 bản.)
   (Dòng #134 — THƯỞNG GIỚI THIỆU (`--referral-row-bg` + nhãn thưởng) — bỏ khỏi header 18/10 cho đủ 3 bản.)
   (Dòng #133 — Ô NẾN TỔNG DANH MỤC Ở TAB CHẨN ĐOÁN — bỏ khỏi header 18/10 cho đủ 3 bản.)
   (Dòng #132 — TAB "GIAO DỊCH" VỀ LẠI HÀNG TAB — bỏ khỏi header 17/10 cho đủ 3 bản.)
   (Dòng #131 — TRANG QUỸ: ĐIỀU CHỈNH ĐVQ + SỬA GHI CHÚ — bỏ khỏi header 17/10 cho đủ 3 bản.)
   (Dòng #130 — KHU THUÊ — bỏ khỏi header 17/10 cho đủ 3 bản.)
   (Dòng #129 — QUẢN TRỊ — bỏ khỏi header 13/10 cho đủ 3 bản.)
   (Dòng #128 — BIỂU ĐỒ NẾN TỪNG COIN Ở KHU #4 TAB CHỈ SỐ, lớp chung `.tf-chart-box` / `.tf-chart-card` — bỏ khỏi header 12/10 cho đủ 3 bản.)
   (Dòng #127 — QUẢN TRỊ: THỰC ĐƠN BA CHẤM NHỎ + KHU "ĐÃ XOÁ" — bỏ khỏi header 11/10 cho đủ 3 bản.)
   (Dòng #126 — NHỊP 1b: DÒNG NHÃN "CHỈ XEM" ĐẦU TRANG QUỸ CỦA NHÓM QUẢN LÝ — bỏ khỏi header 11/10 cho đủ 3 bản.)
   (Dòng #125 — ĐĂNG NHẬP BẰNG GOOGLE, PHẦN TRANG (`.dn-or` · `.dn-google*` · `.dn-foot` · `.chan-trang .foot-link`) — bỏ khỏi header 10/10 cho đủ 3 bản.)
   (Dòng #124 — QUẢN TRỊ THEO NHÓM, ĐỢT 1 (khối `st-*` + `gr-*`) — bỏ khỏi header 10/10 cho đủ 3 bản.)
   (Dòng #123 — TÊN TRANG CHỮ VÀNG + CỔNG ĐĂNG NHẬP VỀ XANH LAM + Ô "TỔNG GIÁ TRỊ" BẢN THÀNH VIÊN — bỏ khỏi header 10/10 cho đủ 3 bản.)
   (Dòng #122 — Ô SỐ THẲNG HÀNG TRÊN MỘT LƯỚI 6 CỘT — bỏ khỏi header 10/10 cho đủ 3 bản.)
   (Dòng #121 — MÀN ĐĂNG NHẬP KIỂU COINTRACKING — bỏ khỏi header 08/10 cho đủ 3 bản.)
   (Dòng #120 — TRANG CHỈ SỐ GỌN LẠI — bỏ khỏi header 06/10 cho đủ 3 bản.)
   (Dòng #119 — thợ ngầm của «dbe08d84»: TRANG QUỸ HAI HÀNG LÃI + DẢI "GIÁ 1 ĐVQ QUA CÁC KỲ", khối (#119) `.quy-figure-band` / `.quy-figure-grid`; đi cặp donviquy #49 · index #264 — bỏ khỏi header 05/10 cho đủ 3 bản.)
   (Dòng #118 — «3059dba8»: DÒNG CHÂN TRANG HIỆN Ở MỌI TRANG + CÂU MIỄN TRỪ GỌN; đi cặp index #262 — bỏ khỏi header 05/10 cho đủ 3 bản.)
   (Dòng #117 — «3059dba8»: TAB CHẨN ĐOÁN, THẺ "GIÁ TRỊ HIỆN TẠI" GỌN LẠI, ba thẻ hàng trên rộng bằng nhau, khối (#117) cuối file; đi cặp index #260 — bỏ khỏi header 05/10 cho đủ 3 bản.)
   (Dòng #116 — thợ ngầm của «3059dba8»: GIAO DIỆN GÓC VUÔNG + Ô SỐ DẠNG THANH DỌC, khối (#116); đi cặp donviquy #46 · index #257 — bỏ khỏi header 05/10 cho đủ 3 bản.)
   (Dòng #115 — thợ ngầm của «9961bdd7»: ĐỔI CHỖ USDT ↔ BUMP, khu phải trang chủ + tab Dữ liệu thị trường (`.tt-markup`, `#trThiTruong #lsBump`, `.qlc-bang`); đi cặp index #256 — bỏ khỏi header 05/10 cho đủ 3 bản.)
   (Dòng #114 — thợ ngầm của «3b0f90b4»: TAB GIAO DỊCH QUỸ "THEO THÀNH VIÊN" HẾT CUỘN NGANG Ở MÀN 1536px, khối (i) — bỏ khỏi header 05/10 cho đủ 3 bản.)
   (Dòng #113 — «3b0f90b4»: MẺ GIAO DIỆN NHỎ chỗ (c) + (e) + (g); đi cặp donviquy #44 — bỏ khỏi header 05/10.)
   (Dòng #112 — 2026-10-04 — TAB "GIAO DỊCH" TRANG QUỸ — bỏ khỏi header 05/10 cho đủ 3 bản.)
   (Dòng #111 — «724eeacc»: THẺ BÁNH VÒNG TAB CHẨN ĐOÁN HẾT VỠ KHUÔN; đi cặp index #243 — bỏ khỏi header 05/10.)
   (Dòng #110 — «8037b552»: TAB "DÒNG TIỀN" TRANG QUỸ LÀM LẠI; đi cặp donviquy #42 — bỏ khỏi header 04/10.)
   (Dòng #109 — «819ad0bb»: HỘP XEM GIẤY TỜ TRANG QUỸ `.quy-xem-tep` + nút menu `.quy-menu-plain`; đi cặp donviquy #41 · index #241 — bỏ khỏi header 04/10.)
   (Dòng #108 — «a5bf7926»: KHUNG BÁNH VÒNG TAB CHẨN ĐOÁN KIỂU MỚI `#trChanDoan .cd-donut-hop`; đi cặp chandoan #20 · portfolio #41 · index #240 — bỏ khỏi header 04/10.)
   (Dòng #107 — «bd824b3f»: DẢI "NẾU RÚT HẾT HÔM NAY": Ô RỘNG THEO CHỮ; đi cặp index #239 — bỏ khỏi header 04/10.)
   (Dòng #106 — «5ccc628e»: BIỂU ĐỒ QUỸ TOÀN MÀN HÌNH, HÀNG NÚT SÁT ĐÁY THẺ — bỏ khỏi header 04/10.)
   (Dòng #105 — HÀNG NÚT BIỂU ĐỒ QUỸ XUỐNG DƯỚI BIỂU ĐỒ — bỏ khỏi header 04/10.)
   (Dòng #104 — «989e00ad»: NÚT "TIỀN TỆ" / "G/R" BIỂU ĐỒ QUỸ, luật nút `.tf-leg` mở thêm `#trQuy`; đi cặp index #235 — bỏ khỏi header 04/10.)
   (Dòng #103 — «e696daec» + «1c32f39e»: TRANG QUỸ ĐỢT A, khối (#103) cuối file; đi cặp donviquy #30 · index #223 — bỏ khỏi header 04/10.)
   (Dòng #102 — VÁ SAU KHI LÊN V215 — bỏ khỏi header 04/10.)
   (Dòng #101 — «c39e536a»: NÚT ĐEN · CHỮ ĐEN · TIÊU ĐỀ VIÊN NANG · CHÂN BẢNG NÚT, khối (#101) cuối file — bỏ khỏi header 04/10.)
   (Dòng #100 — «c824ed82»: EMAIL DƯỚI TÊN NHÀ ĐẦU TƯ, `.quy-ndt-email` — bỏ khỏi header 01/10.)
   (Dòng #99 — «eecee9cc»: NGUỒN GỐC CHỈ SỐ Ở CHÂN TRANG, nút `.chan-trang .foot-origin` — bỏ khỏi header 29/09.)
   (Dòng #98 — «6629c8e0»: HỘP (?) TRANG QUỸ, nút tròn `.quy-hoi` + thân `.quy-hoi-than` — bỏ khỏi header 29/09.)
   (Dòng #97 — «18e677b6»: THANH TRÊN CHỮ MENU + CHUÔNG BÁO — bỏ khỏi header 29/09.)
   (Dòng #96 — «18e677b6»: GIAO DIỆN ĐỢT 2 · 6 Ý, nhóm nút kiểu tab thành nút gạt — bỏ khỏi header 29/09.)
   (Dòng #95 — «84b4ed5f»: TRANG THƯ VIỆN, mọi class `tv-` bó dưới `#trThuVien` — bỏ khỏi header 29/09.)
   (Dòng #94 — «980a08f0»: THANH TAB NÚT GẠT · 6 Ô TỔNG QUAN · NÚT GÓP VỐN NỔI · CHÂN BẢNG THÀNH VIÊN — bỏ khỏi header 29/09.)
   (Dòng #93 — «d8cf76d6»: TRANG QUỸ GỌN · RÕ NHƯ MOCKUP DEV + NHẬT KÝ THAO TÁC — bỏ khỏi header 29/09.)
   (Dòng #92 — «e6f109c1»: 6 Ô TỔNG QUAN KIỂU MOCKUP DEV — bỏ khỏi header 29/09.)
   (Dòng #91 — «e6f109c1»: QUỸ TO · RÕ · THOÁNG NHƯ MOCKUP DEV — bỏ khỏi header 29/09.)
   (Dòng #90 — «f552488b»: QUỸ · LÀM MỜ NGƯỜI ĐÃ TẤT TOÁN — bỏ khỏi header 28/09.)
   (Dòng #88 — «cc616ce6»: QUỸ MẺ 9 · BỐ CỤC MOCKUP_QUY_V2 — bỏ khỏi header 28/09.)
   (Dòng #87 — «fa6c86df»: QUỸ ĐỢT 8 · NHÀ ĐẦU TƯ — bỏ khỏi header 27/09.)
   (Dòng #86 — «fa6c86df»: QUỸ: ₫ KHÔNG RỚT DÒNG — bỏ khỏi header 27/09.)
   (Dòng #85 — «c5350470»: NÚT TẠO DANH MỤC + THẺ CÔNG KHAI — bỏ khỏi header 27/09.)
   (Dòng #84 — «2be5ddf7»/«95fb7468»: BÙ TRANG QUỸ ĐỢT 6 · "Tài khoản của tôi" + "💼 Cài đặt quỹ" giãn hết bề ngang — bỏ khỏi header 27/09.)
   (Dòng #83 — «9b93a836»: `.quy-bao-vang` dải chuông sổ tiết kiệm tới hạn — bỏ khỏi header 27/09.)
   (Dòng #82 — «9b93a836»: BÙ TRANG QUỸ ĐỢT 3, 3 nhãn nhỏ trong ô bảng.)
   (Dòng #81 — «0e46c51c»: BÙ TRANG QUỸ ĐỢT 2.)
     (dòng cảnh báo · 6 ô số · bánh vòng + việc gần đây) · `.quy-ndt-dau` / `.quy-ndt-nut` · chữ nhỏ dưới nhãn `.quy-the` ·
     `.quy-the-ql`. Chỉ THÊM. Đi cặp donviquy.js #6 · index.html #185.
   (Dòng #80 — «0e46c51c»: `.quy-bao-do` dải báo đỏ tỷ giá cũ — bỏ khỏi header 26/09.)
   (Dòng #79 — «5ac17e2d»: `#trQuanTri .wrap{max-width:none}` quản trị giãn hết bề ngang — bỏ khỏi header 26/09.)
   (Dòng #78 — «bc0618a2»: `.quy-nut-cai` · `.quy-dt-the` · `.quy-sdt` · `.quy-o-phi` — bỏ khỏi header 26/09.)
   (Dòng #77 — «bc0618a2»: `.quy-form` · `.o-may` · `.da-huy` · `.quy-hop` cho ba tab Góp / Rút — bỏ khỏi header 26/09.)
   (Dòng #76 — «d6764481»: `.qt-doi` viền vàng ô chưa lưu + `.qt-luu` hàng nút Lưu/Huỷ — bỏ khỏi header 26/09.)
   (Dòng #75 — «d2d3d002»: khối lớp `quy-` ở CUỐI file cho `#trQuy` (8B·7b-1) — bỏ khỏi header 26/09.)
   (Dòng #74 — «4581bed0»: `.ppl-cam` câu lịch sự khi không quyền xem PPL — bỏ khỏi header 26/09.)
   (Dòng #73 — «4581bed0»: khối `.loi-may-dai` dải đỏ báo máy chủ hỏng — bỏ khỏi header 24/09.)
   (Dòng #72 — trang nhúng: khối `body.man-trang` + `#pplKhung` ở cuối file — bỏ khỏi header 23/09.)
   (Dòng #71 — bố cục giống thầy: `body.man-rieng` + `.tk-ben` — bỏ khỏi header 21/09.)



   (Dòng #67 — GD nhịp ⑤, luật `.tk-email` dòng email đầu menu 👤, CỐ Ý không dùng lại `.tk-dong` vì nó có nền hover —
   bỏ khỏi header 21/09 cho đủ 3 dòng; lịch sử đủ trong git.)

   (Dòng #66 — GD nhịp ④, hộp ✎ Giao dịch toàn màn hình `#trGiaodich.gd-nen` + `#gdHop` — bỏ khỏi header 21/09 cho đủ 3
   dòng; lịch sử đủ trong git.)

   (Dòng #65 — GD nhịp ③b, 3 tab con của tab "Dữ liệu thị trường" + bảng Top 100 — bỏ khỏi header 21/09 cho đủ 3
   dòng; lịch sử đủ trong git.)

   (Dòng #64 — GD nhịp ③, 309 bộ chọn `:is(#trTaifu,#tang2)` → `:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac)` cho tab "Dữ liệu
   thị trường" — bỏ khỏi header 20/09 cho đủ 3 dòng; lịch sử đủ trong git.)

   (Dòng #63 — GD nhịp ②, đổi 309 bộ chọn sang `:is(#trTaifu,#tang2)` — bỏ khỏi header 20/09 cho đủ 3 dòng; lịch sử đủ trong git.)

   (Dòng #62 — GD nhịp ① dựng bố cục 3 tầng `.t1`/`.hang-tab`/`.chan-trang` — bỏ khỏi header 20/09 cho đủ 3 dòng; lịch sử đủ trong git.)

   (Dòng #61 — NS-3b, hộp 🟡/🔵 cuối tab Ngân sách — bỏ khỏi header 20/09 cho đủ 3 dòng; lịch sử đủ trong git.)

   ⛔ LUẬT GIỮ LẠI TỪ DÒNG #59 (cắt khỏi header 19/09/2026 cho đủ 3 dòng): luật `[hidden]` của khối Ngân sách vẫn ĐẶT CUỐI file.

   ⛔ LUẬT GIỮ LẠI TỪ DÒNG #47 · #48 · #49 (cắt khỏi header 14/09 và 16/09/2026 cho đủ 3 dòng): khối CSS mới của tab Tái cân
   bằng đặt `display` PHẢI đứng TRƯỚC `#trTaiCanBang [hidden]{display:none}` ở cuối file — hai bộ chọn
   nặng NGANG NHAU nên cái đứng SAU mới thắng; chèn xuống dưới là hỏng luật ẩn.

   ⛔ LUẬT GIỮ LẠI TỪ DÒNG #43 và #44 (đã cắt khỏi header cho đủ 3 dòng): mọi lớp của tab
   Tái cân bằng phải mang tiền tố `tcb-` và scope trong `#trTaiCanBang`. CẤM đặt tên
   trần `.len`/`.xuong`/`.mo` — đã có chủ toàn cục với màu KHÁC.
   ============================================================ */

/* ============================================================
   GHI CHÚ KIẾN TRÚC — GIỮ LẠI KHI DỌN LỊCH SỬ, ĐỪNG XOÁ THEO
   (Hai cảnh báo dưới vốn nằm trong dòng lịch sử #30. Cắt header về 3 dòng là đúng
   luật, nhưng cắt luôn cả cảnh báo thì lần sau lại có người đặt trúng tên `.loi`.)

   ⚠️ Tên class cho dòng báo lỗi của bảng nhập là `.cho-loi`, KHÔNG phải `.loi`:
      `.loi` đã là class của KHUNG BÁO LỖI dùng chung (`.loi b` nút Thử lại,
      `#trTaifu .tf-tab3-msg.loi`) — trùng tên là đè kiểu lên nhau.
      Hiện có 8 rule `.cho-loi` đang sống trong file này.

   ⚠️ LỊCH SỬ ở header CHỈ GIỮ 3 BẢN GẦN NHẤT (luật agents.md). Lịch sử đầy đủ nằm
      trong git — đừng chép tay thêm dòng thứ 4.
   ============================================================ */

:root{
  /* nền và khung */
  --ink:#F6F8FB;
  --panel:#FFFFFF;
  --line:#E4E9F0;
  --line-soft:#F1F4F9;

  /* chữ */
  --txt:#0F172A;
  --dim:#475569;
  --dim2:#64748B;

  /* tín hiệu */
  --up:#059669;
  --down:#EF4444; --down-soft:rgba(239,68,68,.10);
  --gold:#D97706;
  --cool:#4F46E5;
  --cool-soft:#EEF0FE;

  --r:14px;
  --shadow:0 1px 2px rgba(15,23,42,.05), 0 1px 3px rgba(15,23,42,.04);
  --font:'Inter', system-ui, 'Segoe UI', sans-serif;
  --mono:ui-monospace, 'SF Mono', Menlo, Consolas, monospace;

  /* sidebar — light mode: nền trắng/xám nhạt */
  --side-bg:#FFFFFF;
  --side-txt:#334155;
  --side-border:#E4E9F0;
  --side-hover:#F1F4F9;
  --side-active:#EEF0FE;
  --side-dim:#94A3B8;
  --side-dim2:#94A3B8;
  --side-badge-border:#FFFFFF;

  /* màu đặc thù giao diện */
  --overlay:rgba(15,23,42,.45);
  --code-bg:#0F172A;
  --code-txt:#E2E8F0;
  --tooltip-bg:#1F2937;    /* (#42) NỀN TỐI ĐỜI CŨ — nay KHÔNG bảng rê chuột nào còn dùng.
                              Giữ lại vì đây là biến công khai, xoá đi là gãy chỗ nào chưa rà
                              tới. Ai định dùng lại: đọc khối `.tip-chung` ở dưới trước. */
  /* ═══════ (#42) BẢNG RÊ CHUỘT — BỘ MÀU CHUẨN DÙNG CHUNG CẢ TRANG ═══════
     Anh chốt 09/09/2026: "làm một lần cho cả trang, sau này thêm tab mới nó cứ thế mà theo".
     KHÔNG bịa màu mới — 6 biến dưới đây chỉ TRỎ LẠI màu đã có sẵn trong dự án, lấy đúng
     công thức của `.bd-val-tip` (:509) và `#trTaifu .ls-bump-tip` (:1243) — hai bảng ĐÃ nền
     trắng từ trước, chính là mẫu anh đưa trong ảnh.
     ⚠️ CỐ Ý chỉ khai MỘT LẦN ở `:root`, không khai lại trong `[data-theme="dark"]`: `var()`
     tra giá trị tại NƠI DÙNG, mà `--panel`/`--txt`/`--line`/`--dim2` đã tự đổi theo theme
     rồi ⇒ khai lại là chép hai lần cùng một thứ, sau này sửa sót một chỗ là lệch theme. */
  --tip-nen:var(--panel);      /* nền — trắng ở theme sáng, xám thẻ ở theme tối */
  --tip-chu:var(--txt);        /* chữ chính */
  --tip-vien:var(--line);      /* viền 1px, thứ làm nó nổi khỏi nền trắng của trang */
  --tip-mo:var(--dim2);        /* chữ phụ (nhãn, đơn vị, chú thích) */
  --tip-len:var(--cd-lai);     /* SỐ DƯƠNG → xanh (#0E9384) */
  --tip-xuong:var(--cd-lo);    /* SỐ ÂM → đỏ (#F5607E) */
  --nhac-bg:#FFFBEB;
  --nhac-border:#FDE68A;
  --nhac-txt:#92400E;
  --the-mua-bg:#ECFDF5;
  --the-ban-bg:#FEF2F2;
  --tag-hi-bg:#FEF2F2;
  --tag-lo-bg:#ECFDF5;
  --loi-bg:#FEF2F2;
  --thieu-gia-bg:#FFFBEB;
  --thieu-gia-hover:#FEF3C7;

  /* Hàng nhập giao dịch (#27) — ba màu ô anh dùng để phân biệt bằng mắt:
     🟡 máy tự điền (sửa tay được) · ⬜ máy tự tính (không gõ được) · trắng = anh nhập tay */
  --o-tudien-nen:#FFFBEB;
  --o-tudien-vien:#F59E0B;
  --o-tutinh-nen:#F1F5F9;
  --hang-nhap-nen:#FAFBFF;
  --hang-cho-nen:#FEF9E7;   /* dòng đã gõ xong, CHƯA gửi lên máy chủ (#28) */
  --hang-cho-vien:#EAB308;

  /* đường "Tổng" chồng lên biểu đồ nến (chặng 4.2b): navy sáng light / xanh nhạt dark */
  --bd-tong:#3B5BDB;
  --thay:#1E88E5;          /* GĐ3-D: đường THẦY (line xanh da trời) chồng lên nến tái tạo */
  /* Tab Chẩn đoán — 6 BIẾN nhưng đúng 5 MÀU (`--cd-lai` cố ý trùng mã với
     `--cd-da-chot`, xem chú thích ngay dưới). CỐ Ý KHÔNG khai lại ở
     khối nền tối: chúng mã hoá ý nghĩa lãi/lỗ, không phải tông nền. canvas không
     đọc được class nên phải lấy màu qua biến. */
  --cd-da-chot:#0E9384;    /* tầng "đã chốt" của cột chồng */
  --cd-chua-chot:#2ED3B7;  /* tầng "chưa chốt" */
  --cd-lai:#0E9384;        /* CHỮ của mọi số DƯƠNG (24h, quán quân lời). Cùng mã với
                              --cd-da-chot nhưng CỐ Ý tách tên: một cái là màu khối vẽ,
                              một cái là màu chữ — sau này đổi được độc lập. */
  --cd-lo:#F5607E;         /* lỗ chưa chốt, và CHỮ của mọi số ÂM */
  --cd-lo-chot:#C7274F;    /* lỗ đã chốt (đậm hơn) */
  --cd-hoa:#E4E8EF;        /* lát "Hoà (P/L = 0)" của pie Tỷ lệ thắng — ĐANG DÙNG THẬT từ
                              nhịp 2a (`latThangThua` trong chandoan.js) */
}

[data-theme="dark"]{
  /* nền và khung */
  --ink:#0D1117;
  --panel:#161B22;
  --line:#30363D;
  --line-soft:#21262D;

  /* chữ */
  --txt:#E6EDF3;
  --dim:#A1AAB4;
  --dim2:#8B949E;

  /* tín hiệu — giữ nguyên sắc nét */
  --up:#3FB950;
  --down:#F85149; --down-soft:rgba(248,81,73,.14);
  --gold:#D29922;
  --cool:#7B91F5;
  --cool-soft:#1C2045;

  --shadow:0 1px 2px rgba(0,0,0,.3), 0 1px 3px rgba(0,0,0,.25);

  /* sidebar — dark mode */
  --side-bg:#111A2E;
  --side-txt:#C7D2E4;
  --side-border:rgba(255,255,255,.07);
  --side-hover:rgba(255,255,255,.06);
  --side-active:#2A3550;
  --side-dim:#5C6B84;
  --side-dim2:#7F8FA8;
  --side-badge-border:#111A2E;

  /* màu đặc thù */
  --overlay:rgba(0,0,0,.65);
  --code-bg:#010409;
  --code-txt:#C9D1D9;
  --tooltip-bg:#30363D;
  --nhac-bg:#2D2000;
  --nhac-border:#5A3E00;
  --nhac-txt:#D29922;
  --the-mua-bg:#0D2818;
  --the-ban-bg:#2A0C0C;
  --tag-hi-bg:#2A0C0C;
  --tag-lo-bg:#0D2818;
  --loi-bg:#2A0C0C;
  --thieu-gia-bg:#2D2000;
  --thieu-gia-hover:#3D2C00;

  /* Hàng nhập giao dịch (#27) — bản nền tối, giữ đúng ý nghĩa 3 màu ở nền sáng */
  --o-tudien-nen:#2D2000;
  --o-tudien-vien:#D29922;
  --o-tutinh-nen:#161B22;
  --hang-nhap-nen:#151B2E;
  --hang-cho-nen:#2A2410;   /* dòng chờ — bản nền tối (#28) */
  --hang-cho-vien:#A16207;

  --bd-tong:#93A9FF;
  --thay:#4FC3F7;          /* GĐ3-D: đường THẦY (line xanh da trời) — sáng hơn cho nền tối */
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; background:var(--ink); color:var(--txt);
  font-family:var(--font); line-height:1.65; -webkit-font-smoothing:antialiased;
}
.wrap{max-width:1120px; margin:0 auto; padding:0 20px}
/* Trang Giao dịch: bỏ giới hạn bề ngang để bảng chiếm hết vùng nội dung.
   Vùng nội dung là flex:1 nên tự giãn khi ẩn menu -> các cột mở rộng hết,
   khỏi phải kéo thanh trượt ngang. */
#trGiaodich .wrap{max-width:none}

/* (#132) TAB "GIAO DỊCH" VỀ LẠI HÀNG TAB (index.html #294, anh chốt 13/10/2026): vỏ hộp ✎ toàn màn hình của #66
   (nền tối `gd-nen` · khung `#gdHop` · thanh tiêu đề · nút ✕ · chân hộp) ĐÃ GỠ — `#trGiaodich` nay là một `.trang`
   thường, hiện / ẩn theo class `hien` như mọi tab. Hàng tab đứng ngay trên ⇒ giữ đệm trên gọn của hero. */
#trGiaodich .hero-gd{padding-top:14px}
.num{font-variant-numeric:tabular-nums}

/* ═══════════ (#42) BẢNG RÊ CHUỘT — NGOẠI HÌNH CHUẨN, DÙNG CHUNG CẢ TRANG ═══════════
   VIỆC NÀY LÀM MỘT LẦN. Tab mới về sau chỉ cần đặt `class="tip-chung"` cho thẻ bảng của
   mình là có đủ nền trắng + viền + bóng + màu số âm/dương — CẤM chép lại 6 dòng này.

   Vì sao gộp bộ chọn thay vì bắt mỗi bảng thêm class `tip-chung`:
   3 thẻ `.donut-tip` · `.cd-pb-tip` · `.cd-tip` do JS tự tạo với className CỐ ĐỊNH
   (`portfolio.js:2367` · `index.html` · `chandoan.js:2107`). Gộp bộ chọn ở đây thì
   `portfolio.js` KHÔNG phải sửa một chữ nào — đỡ bump thêm một file frontend chỉ để
   thêm 10 ký tự. Đổi lại: thêm bảng mới thì nhớ dùng `tip-chung`, đừng đẻ tên thứ tư.

   Ba khối đã nền trắng từ trước — `.bd-val-tip` (:509) và `#trTaifu .ls-bump-tip` (:1243) —
   CỐ Ý để nguyên, không kéo vào bộ chọn này: chúng dùng `display:none` chứ không dùng
   `opacity` như 3 thẻ dưới, gộp vào là phải sửa cả JS của chúng. Chúng đã đúng mẫu rồi.

   ⚠️ KHÔNG có `color:#fff` ở đây, và 3 khối dưới cũng đã bỏ: nền trắng mà chữ trắng
   là mất chữ. */
.tip-chung,
.donut-tip,
#trChanDoan .cd-pb-tip,
#trChanDoan .cd-tip{
  background:var(--tip-nen); color:var(--tip-chu);
  border:1px solid var(--tip-vien); border-radius:8px;
  padding:7px 10px; font-size:12.5px; line-height:1.55; white-space:nowrap;
  box-shadow:0 4px 14px rgba(0,0,0,.14);
}
/* Số DƯƠNG xanh · số ÂM đỏ.
   ⚠️ TIỀN TỐ `tip-` LÀ BẮT BUỘC, ĐỪNG RÚT GỌN. Tên "đọc được thành lời" là `.len`/`.xuong`,
   nhưng HAI TÊN ĐÓ ĐÃ CÓ CHỦ từ trước ở dòng ~641 (`.len{color:var(--up)}`), đang được
   `portfolio.js` và `taifu.js` dùng với màu KHÁC (#059669/#EF4444 chứ không phải
   #0E9384/#F5607E). Đặt trùng tên thì cùng một chữ `.len` cho ra hai sắc xanh tuỳ chỗ đứng
   — không ai lần ra nổi. `soat-loi` bắt được 09/09/2026 khi lớp mới còn chưa kịp lan ra. */
.tip-chung .tip-len, .donut-tip .tip-len,
#trChanDoan .cd-pb-tip .tip-len, #trChanDoan .cd-tip .tip-len{color:var(--tip-len); font-weight:600}
.tip-chung .tip-xuong, .donut-tip .tip-xuong,
#trChanDoan .cd-pb-tip .tip-xuong, #trChanDoan .cd-tip .tip-xuong{color:var(--tip-xuong); font-weight:600}
/* Chữ phụ: nhãn, đơn vị, chú thích trong ngoặc. (`.mo` trần cũng đã có chủ — `tr.trade`.) */
.tip-chung .tip-mo, .donut-tip .tip-mo,
#trChanDoan .cd-pb-tip .tip-mo, #trChanDoan .cd-tip .tip-mo{color:var(--tip-mo)}
/* Chấm màu đầu dòng — nhại `.ls-bump-tip .sw`, nhưng cũng mang tiền tố cho đồng bộ. */
.tip-chung .tip-sw, .donut-tip .tip-sw,
#trChanDoan .cd-pb-tip .tip-sw, #trChanDoan .cd-tip .tip-sw{
  display:inline-block; width:9px; height:9px; border-radius:2px;
  margin-right:6px; vertical-align:baseline;
}
/* Bảng tự dựng của tab mới: mặc định ẩn, thêm `.hien` để bật — giống 3 thẻ trên. */
.tip-chung{position:absolute; left:0; top:0; pointer-events:none;
  transform:translate(-50%,-100%) translateY(-12px);
  opacity:0; transition:opacity .1s}
.tip-chung.hien{opacity:1}
.tip-chung.duoi{transform:translate(-50%,0) translateY(14px)}

/* ---------------- mở đầu ---------------- */
.hero{padding:52px 0 26px}
.eyebrow{display:inline-flex; align-items:center; gap:8px; font-size:12.5px;
  font-weight:600; letter-spacing:.1em; text-transform:uppercase;
  color:var(--cool); background:var(--cool-soft); padding:6px 12px; border-radius:99px}
h1{margin:18px 0 0; font-size:clamp(28px,4.6vw,44px); line-height:1.15;
  letter-spacing:-.025em; font-weight:700; max-width:19ch}
.lede{margin:18px 0 0; font-size:17px; color:var(--dim); max-width:62ch}
.lede b{color:var(--txt); font-weight:600}

/* ---------------- thẻ biểu đồ ---------------- */
.card{background:var(--panel); border:1px solid var(--line);
  border-radius:var(--r); box-shadow:var(--shadow)}

.chart-head{display:flex; flex-wrap:wrap; align-items:flex-end; gap:16px 22px;
  padding:20px 22px 16px; border-bottom:1px solid var(--line)}
.chart-head .title{font-size:15px; font-weight:600}
.chart-head .title span{display:block; font-size:13.5px; font-weight:400;
  color:var(--dim2); margin-top:3px}
.now{margin-left:auto; text-align:right}
.now .v{font-size:34px; font-weight:700; line-height:1; letter-spacing:-.02em}
.now .t{font-size:12.5px; color:var(--dim2); margin-top:6px}

/* thước phân vị — phần đặc trưng của trang */
.ruler{padding:18px 22px 4px}
.ruler-head{display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap;
  font-size:11.5px; letter-spacing:.13em; text-transform:uppercase;
  color:var(--dim2); margin-bottom:9px}
.ruler-bar{position:relative; height:34px; border-radius:8px;
  overflow:hidden; background:var(--line-soft)}
.ruler-bar canvas{display:block; width:100%; height:100%}
.ruler-mark{position:absolute; top:-3px; bottom:-3px; width:2px;
  background:var(--gold); border-radius:2px}
.ruler-scale{display:flex; justify-content:space-between; margin-top:7px;
  font-size:12px; color:var(--dim2)}

.bar{display:flex; flex-wrap:wrap; align-items:center; gap:10px; padding:16px 22px 12px}
.tf{display:flex; gap:2px; background:var(--line-soft); padding:3px;
  border-radius:10px; border:1px solid var(--line)}
.tf button{all:unset; cursor:pointer; padding:7px 15px; border-radius:7px;
  font-size:13.5px; font-weight:600; color:var(--dim); transition:.15s}
.tf button:hover{color:var(--txt)}
.tf button:focus-visible{outline:2px solid var(--cool); outline-offset:2px}
.tf button[aria-pressed="true"]{background:var(--cool); color:#fff}
/* Nút bật/tắt dấu trên biểu đồ (độc lập, không phải radio) */
.tgl{display:flex; gap:6px}
.tgl button{all:unset; cursor:pointer; padding:6px 13px; border-radius:8px; font-size:13.5px;
  border:1px solid var(--line); color:var(--dim2)}
.tgl button:hover{color:var(--txt)}
.tgl button[aria-pressed="true"]{background:var(--cool); color:#fff; border-color:transparent}
.ohlc{display:flex; gap:14px; flex-wrap:wrap; font-size:13.5px; color:var(--dim)}
.ohlc b{font-weight:600; color:var(--txt)}
.hint{width:100%; font-size:12.5px; color:var(--gold); margin-top:-2px}

.chart{height:440px; margin:0 10px}
.chart iframe{display:block; width:100%; height:100%; border:0}
.state{padding:26px 22px; font-size:14px; color:var(--dim)}
.state b{color:var(--down)}

.stats{display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:1px; background:var(--line); border-top:1px solid var(--line)}
.stat{background:var(--panel); padding:14px 18px}
.stat .k{font-size:11.5px; letter-spacing:.13em; text-transform:uppercase; color:var(--dim2)}
.stat .v{font-size:19px; font-weight:600; margin-top:6px; letter-spacing:-.01em}

.src{padding:13px 20px; border-top:1px solid var(--line);
  background:var(--line-soft); font-size:13px; color:var(--dim2);
  border-radius:0 0 var(--r) var(--r)}

/* ---------------- các mục nội dung ---------------- */
section{padding:52px 0}
h2{margin:0; font-size:26px; font-weight:700; letter-spacing:-.02em}
.sub{margin:9px 0 0; color:var(--dim); max-width:64ch}
.grid{display:grid; gap:16px; margin-top:26px;
  grid-template-columns:repeat(auto-fit,minmax(258px,1fr))}
.box{background:var(--panel); border:1px solid var(--line); border-radius:var(--r);
  padding:22px; box-shadow:var(--shadow)}
.box h3{margin:0; font-size:16px; font-weight:600; display:flex; align-items:center; gap:9px}
.box p{margin:11px 0 0; font-size:14.5px; color:var(--dim)}
.tag{font-size:12px; font-weight:700; padding:3px 9px; border-radius:99px}
.tag.hi{background:var(--tag-hi-bg); color:var(--down)}
.tag.mid{background:var(--line-soft); color:var(--dim)}
.tag.lo{background:var(--tag-lo-bg); color:var(--up)}

.method{margin-top:26px; padding:26px}
.formula{margin:0 0 22px; padding:15px 18px; border-radius:10px; overflow-x:auto;
  background:var(--code-bg); color:var(--code-txt); font-family:var(--mono); font-size:14px}
.formula .a{color:#7DD3FC}
.formula .b{color:#FCD34D}
dl{margin:0; display:grid; gap:16px; grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
dt{font-size:12px; font-weight:600; letter-spacing:.11em;
  text-transform:uppercase; color:var(--dim2)}
dd{margin:7px 0 0; font-size:14.5px; color:var(--dim)}
dd b{color:var(--txt); font-weight:600}

/* ---------------- chân trang ---------------- */
footer{border-top:1px solid var(--line); padding:34px 0 46px; margin-top:20px}
footer .who{font-size:14px; font-weight:600; color:var(--dim)}
footer p{margin:6px 0 0; font-size:13.5px; color:var(--dim2); max-width:60ch; line-height:1.75}
.disclaimer{margin-top:18px; padding:15px 17px; border:1px solid var(--line);
  border-radius:11px; background:var(--panel);
  font-size:13.5px; color:var(--dim2); line-height:1.75}

@media (max-width:760px){
  .hero{padding:36px 0 20px}
  section{padding:38px 0}
  .chart{height:340px}
  .now{margin-left:0; text-align:left; width:100%}
  .now .v{font-size:27px}
  .logo small{display:none}
  nav a{padding:8px 10px; font-size:13.5px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{transition:none !important}
}

/* ---------------- khối chỉ số hiện tại ---------------- */
.hero{display:grid; gap:34px; align-items:center;
  grid-template-columns:minmax(0,1.15fr) minmax(310px,.85fr)}
.hero-text h1{margin-top:18px}

.quote{background:var(--panel); border:1px solid var(--line); border-radius:var(--r);
  box-shadow:var(--shadow); padding:22px 22px 16px}
.q-main{text-align:center; padding-bottom:16px; border-bottom:1px solid var(--line)}
.q-val{font-size:40px; font-weight:700; line-height:1; letter-spacing:-.025em}
.q-lab{margin-top:9px; font-size:14px; font-weight:600; color:var(--txt)}
.q-row{display:flex; align-items:baseline; gap:10px; padding:13px 0;
  border-bottom:1px solid var(--line-soft)}
.q-name{flex:1 1 auto; font-size:13.5px; color:var(--dim2); min-width:0}
.q-name b{color:var(--txt); font-weight:600; font-size:14px}
.q-price{font-size:14.5px; font-weight:600; white-space:nowrap}
.q-chg{font-size:13.5px; font-weight:600; white-space:nowrap; min-width:76px; text-align:right}
.q-time{padding-top:12px; font-size:12px; color:var(--dim2); text-align:center}

@media (max-width:860px){
  .hero{grid-template-columns:1fr; gap:26px}
  .q-val{font-size:34px}
}


/* ============================================================
   BỐ CỤC 3 TẦNG — GD nhịp ① (#62), THAY menu bên trái
   Tầng 1 `.t1`: thanh trên dính đầu trang. Tầng 3 `.hang-tab`: hàng tab ngang.
   Tầng 2 (bảng danh mục + biểu đồ nến cạnh nhau) làm ở nhịp ②.
   Số đo theo trang thầy (THIET_KE_GIAO_DIEN_GIONG_THAY_V1 §5): thanh trên 71px, tab 140×51 chữ 18px,
   tab đang chọn nền xám + chữ màu chính. Màu lấy từ token sẵn có (--panel --line --cool …) chứ KHÔNG
   chép mã màu của hình mẫu ⇒ chế độ tối tự ăn theo, không đẻ nguồn màu thứ hai.
   ⚠️ Token `--side-*` ở :root VẪN SỐNG — nút sáng/tối, ô USD/VND, nút đăng xuất (nay trong menu 👤) đang dùng.
   ============================================================ */
:root{--t1-h:71px}
/* (#130) KHU THUÊ (vd demo.chukyvang.com) — dải "BẢN DEMO" nằm TRÊN thanh trên, cùng đứng yên khi cuộn (mẫu A, Mockups/dai-ban-demo-v1.html).
   nav.js #45 chỉ gắn class `rental-zone` lên <html> và mở `#demoRibbon` khi api.js #29 báo đang ở khu thuê; trang chính KHÔNG có class này
   ⇒ `--demo-ribbon-h` là 0px, `--t1-h` vẫn 71px, ba luật `html.rental-zone …` không khớp, dải ẩn — bố cục trang chính không lệch 1px.
   Ở khu thuê `--t1-h` = 71 + 24 = 95px: nó là "phần đầu trang bị che", mọi chỗ `top` / `100vh -` / `scroll-margin` dùng biến này tự lùi theo;
   riêng `.t1` phải trừ lại 24px để thanh vẫn cao 71px. z-index 46: trên `.t1` (45), DƯỚI hộp nổi toàn màn (50 trở lên); cổng đăng nhập (1000) thì tự lùi xuống nhường dải (luật `.dn-nen` bên dưới).
   ⚠️ line-height 1.5, CẤM về 1: dấu tiếng Việt (Ả, ệ, ỹ) bị cắt đầu. Chữ dài hơn màn ⇒ cắt bằng dấu ba chấm, không xuống dòng (câu hiện tại vừa màn 390px). */
:root{--demo-ribbon-h:0px}
html.rental-zone{--demo-ribbon-h:24px; --t1-h:95px}
html.rental-zone .t1{top:var(--demo-ribbon-h); height:calc(var(--t1-h) - var(--demo-ribbon-h))}
/* Cổng đăng nhập `.dn-nen` phủ kín màn (fixed · inset:0 · z-index 1000) ⇒ ở khu thuê lùi mép trên xuống đúng bằng dải, để khách vào lần đầu
   (thấy cổng trước tiên) vẫn thấy dải "BẢN DEMO" phía trên. Mép dưới vẫn 0 nên cổng tự thấp đi 24px. */
html.rental-zone .dn-nen{top:var(--demo-ribbon-h)}
.demo-ribbon{position:sticky; top:0; z-index:46; box-sizing:border-box; height:24px; display:flex; align-items:center; justify-content:center; gap:10px;
  padding:0 12px; background:#b45309; color:#fff; font-size:13px; font-weight:600; line-height:1.5; letter-spacing:.04em; white-space:nowrap; overflow:hidden}
.demo-ribbon[hidden]{display:none}
.demo-ribbon-label{flex:none; padding:0 7px; border-radius:3px; background:#fff; color:#b45309; letter-spacing:.08em}
.demo-ribbon-text{min-width:0; font-weight:500; letter-spacing:0; overflow:hidden; text-overflow:ellipsis}
body.app{min-height:100vh}

/* z-index 45: trên tiêu đề bảng dính (2–5), DƯỚI hộp nổi toàn màn (.phu-nen 50, 60, 70). */
.t1{position:sticky; top:0; z-index:45; height:var(--t1-h); display:flex; align-items:center;
  justify-content:space-between; gap:16px; padding:0 20px; background:var(--panel);
  border-bottom:1px solid var(--line); box-shadow:0 0 2px rgba(15,23,42,.12)}
.t1-logo{display:flex; align-items:center; gap:11px; text-decoration:none; min-width:0}
/* (#123) TÊN TRANG CHỮ VÀNG (anh gật mẫu Mockups/mockup-ten-trang-chu-vang-v1.html 23:55 05/10): ảnh 44, "Chu Kỳ" đen đậm theo màu chữ
   (nền tối tự thành trắng), "Vàng" vàng kim `.brand-gold`, dòng nhỏ màu chữ thường — hết xanh lam. `.brand-gold` dùng chung cho thanh trên
   và cổng đăng nhập; màu vàng là màu THƯƠNG HIỆU nên khai thẳng mã màu, giống nhau ở cả hai chế độ sáng / tối. */
.t1-logo img{width:44px; height:44px; border-radius:11px; flex:none; object-fit:cover}
.t1-logo .ten{font-weight:800; color:var(--txt); font-size:26px; line-height:1.1; letter-spacing:-.01em; white-space:nowrap; padding-bottom:3px}   /* 3px: chừa chỗ cho bóng chữ vàng khi màn hẹp bật overflow:hidden */
.t1-logo .ten small{display:block; margin-top:2px; font-size:13.5px; font-weight:400; color:var(--txt); letter-spacing:0}
.brand-gold{background:linear-gradient(180deg,#FFF6C2 0%,#F7D25C 26%,#D9990F 50%,#FCE48E 68%,#B67806 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent; -webkit-text-fill-color:transparent;
  -webkit-text-stroke:.3px #B8860B; filter:drop-shadow(0 1px 0 #9A6A00) drop-shadow(0 2px 3px rgba(120,80,0,.28))}
/* (GoldWord) CHỮ "VÀNG" ẢNH 3D ÁNH KIM — mẫu D Gemini anh chốt 03/11/2026, chép NGUYÊN trang mẫu
   chukyvang/File-MD/AI-to-AI/chu-vang-3d/xem-thu-chu-vang-gemini-v1.html (mẫu D, đồng ₿ Cam Bitcoin). Thẻ: app/GoldWord.tsx.
   Đường dẫn ảnh (nền .gold-word-image + mặt nạ ::after) do GoldWord.tsx gắn bằng thẻ <style> lúc chạy — lý do ghi đầu tệp đó.
   Mặt nạ CHỈ ở ::after, KHÔNG ở chính lớp ảnh (đặt cả hai ⇒ mép chữ nhân đôi độ mờ alpha², răng cưa). Gương chạy thẳng background-position
   của ::after (không qua biến CSS) để Chrome không giải mã lại ảnh mỗi khung hình. `.brand-gold` trên GIỮ NGUYÊN (nơi khác còn dùng). */
.gold-word{--coin:#F7931A; --coin-soft:#FBC77F; position:relative; display:inline-block; vertical-align:baseline}   /* ô giữ đúng bề ngang chữ Vàng ⇒ chữ bên cạnh không xô */
.gold-word .gold-word-text{display:inline-block; transition:opacity 1s cubic-bezier(.4,0,.2,1), transform 1s cubic-bezier(.4,0,.2,1)}
.gold-word .gold-word-coin{position:absolute; left:50%; top:50%; width:1.1em; height:1.1em; margin:-.52em 0 0 -.55em; opacity:0; transition:opacity 1s cubic-bezier(.4,0,.2,1)}
.gold-word.gold-word-on-coin .gold-word-text{opacity:0; transform:scale(.85); transition-duration:.8s}
.gold-word.gold-word-on-coin .gold-word-coin{transition-duration:.4s; opacity:1}
.gold-word-coin svg{display:block; width:100%; height:100%; overflow:visible}
/* đồng ₿ tự vẽ 6,2 giây: phình tròn → B trắng trượt vào → tan nền → B màu + vòng viền tự vẽ */
.gold-word-playing .gold-word-coin-disc{animation:gold-word-coin-disc 6.2s linear forwards}
.gold-word-playing .gold-word-coin-white{animation:gold-word-coin-white 6.2s linear forwards}
.gold-word-playing .gold-word-coin-tick{animation:gold-word-coin-tick 6.2s linear forwards}
.gold-word-playing .gold-word-coin-color{animation:gold-word-coin-color 6.2s linear forwards}
.gold-word-playing .gold-word-coin-ring{animation:gold-word-coin-ring 6.2s linear forwards}
.gold-word-coin-disc,.gold-word-coin-white,.gold-word-coin-color{transform-box:view-box; transform-origin:32px 32px}
.gold-word-coin-tick{transform-box:fill-box; transform-origin:50% 50%}
.gold-word-coin-disc{fill:var(--coin); opacity:0}
.gold-word-coin-white{opacity:0} .gold-word-coin-color{opacity:0} .gold-word-coin-ring{opacity:0}
.gold-word-coin-white path, .gold-word-coin-white rect{fill:#fff}
.gold-word-coin-color path, .gold-word-coin-color rect{fill:var(--coin)}
.gold-word-coin-ring{fill:none; stroke:var(--coin); stroke-width:1.6; stroke-dasharray:182.3; stroke-dashoffset:182.3}
@keyframes gold-word-coin-disc{0%{opacity:.35; transform:scale(0); fill:var(--coin-soft)} 10.08%{opacity:1; transform:scale(1); fill:var(--coin)}
  40.32%{opacity:1; transform:scale(1)} 45.73%{opacity:0; transform:scale(.62)} 100%{opacity:0}}
@keyframes gold-word-coin-white{0%,10.08%{opacity:0; transform:translateX(-7px) scale(.92)} 16.94%{opacity:.45} 23.55%{opacity:1; transform:none}
  40.32%{opacity:1} 45.73%{opacity:0; transform:scale(.78)} 100%{opacity:0}}
@keyframes gold-word-coin-tick{0%,21.53%{transform:scaleY(0)} 24.19%,100%{transform:scaleY(1)}}
@keyframes gold-word-coin-color{0%,40.32%{opacity:0; transform:scale(.84)} 45.73%{opacity:.6; transform:scale(.84)} 47.02%,100%{opacity:1; transform:scale(.84)}}
@keyframes gold-word-coin-ring{0%,47.02%{opacity:0; stroke-dashoffset:182.3} 47.1%{opacity:1} 95.48%,100%{opacity:1; stroke-dashoffset:0}}
/* ảnh chữ Vàng mẫu D: số đo y trang mẫu (.v-D .vf-img) */
.gold-word-inner{position:relative; display:inline-block}
.gold-word-image{display:inline-block; position:relative; height:1.38em; aspect-ratio:1113/639; vertical-align:-.31em; margin:0 0 0 .04em;
  background-position:center; background-size:contain; background-repeat:no-repeat}
.gold-word-image::after{content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(115deg, transparent 40%, rgba(255,252,235,.82) 41%, rgba(255,255,255,.92) 44%, rgba(255,252,235,.82) 47%,
    transparent 48%, transparent 51%, rgba(255,250,220,.72) 51.5%, rgba(255,250,220,.72) 53.5%, transparent 54%) no-repeat;
  background-size:6em 100%; background-position:.8em 0;
  -webkit-mask-position:center; -webkit-mask-size:contain; -webkit-mask-repeat:no-repeat;
  mask-position:center; mask-size:contain; mask-repeat:no-repeat}
/* vệt gương quét tới – nghỉ – lui 3,8 giây */
.gold-word-shining .gold-word-image::after{animation:gold-word-shine 3.8s linear}
@keyframes gold-word-shine{
  0%{background-position:.8em 0; animation-timing-function:cubic-bezier(.45,0,.25,1)}
  36.8%{background-position:-3.8em 0}
  63.2%{background-position:-3.8em 0; animation-timing-function:cubic-bezier(.45,0,.25,1)}
  100%{background-position:.8em 0}}
/* 5 ngôi sao 4 cánh */
.gold-word-star{position:absolute; left:var(--sx); top:var(--sy); width:var(--ss,.3em); height:var(--ss,.3em); margin:calc(var(--ss,.3em) / -2) 0 0 calc(var(--ss,.3em) / -2);
  transform:scale(0); pointer-events:none; z-index:2}
.gold-word-star svg{display:block; width:100%; height:100%; filter:drop-shadow(0 0 .05em #F7D25C) drop-shadow(0 0 .02em #B67806)}
.gold-word-shining .gold-word-star{animation:gold-word-star 2.4s ease-in-out var(--sd) 2 both}
@keyframes gold-word-star{0%{transform:scale(0) rotate(0)} 12.5%{transform:scale(1) rotate(45deg)} 25%{transform:scale(.15) rotate(90deg)} 30%,100%{transform:scale(0) rotate(90deg)}}
/* máy bật "giảm chuyển động" ⇒ đứng yên ở ảnh chữ Vàng */
@media (prefers-reduced-motion:reduce){
  .gold-word-shining .gold-word-image::after,.gold-word-shining .gold-word-star{animation:none}
  .gold-word .gold-word-text,.gold-word .gold-word-coin{transition:none}
  .gold-word.gold-word-on-coin .gold-word-text{opacity:1; transform:none} .gold-word.gold-word-on-coin .gold-word-coin{opacity:0}
}
/* (hết GoldWord) */
.t1-nav{display:flex; align-items:center; gap:18px; font-size:14px}
.t1-nav > a{color:var(--dim); text-decoration:none; padding:4px 0; border-bottom:2px solid transparent; white-space:nowrap}
.t1-nav > a:hover{color:var(--txt)}
.t1-nav > a.t1-chon{color:var(--cool); border-bottom-color:var(--cool)}
.t1-nav > a:focus-visible{outline:2px solid var(--cool); outline-offset:2px}

/* Menu 👤 — nhịp ① dựng 3 món (đơn vị tiền · sáng/tối · đăng xuất); (#67) nhịp ⑤ thêm dòng email trên cùng.
   "Tài khoản của tôi" + "🔑 Quản trị" CỐ Ý chưa có — lý do ghi ở chú thích khối menu trong `index.html`.
   Mở/đóng bằng thuộc tính `hidden` (nav.js); `.tk-menu[hidden]` nặng hơn `.tk-menu` nên luôn thắng. */
.tk-boc{position:relative}
.tk-nut{all:unset; cursor:pointer; width:32px; height:32px; border-radius:50%; display:grid; place-items:center;
  background:var(--txt); color:var(--panel)}
.tk-nut svg{width:18px; height:18px}
.tk-nut:focus-visible{outline:2px solid var(--cool); outline-offset:2px}
/* (#67) `max-width` là thứ LÀM CHO `text-overflow:ellipsis` của .tk-email chạy được. Đo thật trên
   Live Server 20/09: thiếu dòng này thì email dài kéo menu từ 240px nong ra 492px và KHÔNG cắt chữ
   — vì `overflow:hidden` chỉ có tác dụng khi hộp CHA bị chặn bề ngang. `calc(100vw - 32px)` lo màn
   điện thoại: menu dính mép phải, không có chặn là nó thò ra ngoài màn. */
.tk-menu{position:absolute; right:0; top:calc(100% + 8px); min-width:240px; max-width:min(320px, calc(100vw - 32px)); z-index:46;
  display:flex; flex-direction:column; gap:2px; padding:6px; background:var(--panel);
  border:1px solid var(--line); border-radius:10px; box-shadow:0 8px 24px rgba(15,23,42,.14)}
.tk-menu[hidden]{display:none}
.tk-dong{display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:6px 8px; border-radius:8px; font-size:14px; color:var(--txt)}
.tk-dong:hover{background:var(--side-hover)}
/* (#67) Dòng email: CHỈ ĐỂ ĐỌC ⇒ không nền hover, không con trỏ tay — nhìn là biết không bấm được.
   Email dài (kiểu ten.ho.dem@congty-rat-dai.com) thì cắt bằng …, đừng để nó nong menu rộng ra
   khỏi mép phải màn hình. Viền mượn --line của khối này.
   ⚠️ MÀU CHỮ dùng --dim, KHÔNG dùng --side-dim2 như mấy nút cạnh nó. Đo thật 20/09 (độ tương phản
   so với nền menu, chuẩn dễ đọc 4,5:1):
       --side-dim2 → 2,56:1 ở chế độ SÁNG (mờ, khó đọc) · 5,27:1 ở chế độ tối
       --dim       → 4,76:1 ở chế độ SÁNG · 5,62:1 ở chế độ tối   ⇒ đạt ở CẢ HAI
   Mấy nút cạnh nó giữ --side-dim2 vẫn đúng vì chúng là BIỂU TƯỢNG, không phải chữ phải đọc từng ký tự;
   còn đây là địa chỉ email lẫn chữ với số với dấu chấm. Đừng "gom cho đồng bộ" rồi làm nó mờ lại. */
.tk-email{padding:6px 8px 8px; margin-bottom:2px; border-bottom:1px solid var(--line);
  font-size:13px; line-height:1.35; color:var(--dim);
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
/* Nút đăng xuất: luật gốc (inline trong <head> index.html) là icon vuông 32px — trong menu thì thành một dòng. */
.tk-menu .bt-dangxuat{width:auto; height:auto; padding:8px; justify-content:space-between; color:var(--txt);
  border-radius:8px; font-size:14px}

/* Nút toggle theme — 1 nút, icon SVG đổi theo theme */
.bt-theme{all:unset; cursor:pointer; width:32px; height:32px; border-radius:8px;
  display:grid; place-items:center; color:var(--side-dim2); flex:none;
  transition:background .15s, color .12s}
.bt-theme:hover{background:var(--side-hover); color:var(--side-txt)}
.bt-theme:focus-visible{outline:2px solid var(--cool); outline-offset:1px}
.bt-theme svg{width:18px; height:18px}
/* icon mặt trăng ẩn ở chế độ sáng, hiện ở chế độ tối */
.bt-theme .ic-moon{display:none}
.bt-theme .ic-sun{display:block}
[data-theme="dark"] .bt-theme .ic-moon{display:block}
[data-theme="dark"] .bt-theme .ic-sun{display:none}

/* (#40) Ô xổ xuống đổi đơn vị tiền USD/VND — cùng cỡ với nút sáng/tối (nay cùng nằm trong menu 👤).
   Vì sao đặt ở đây chứ không nhại chỗ inline của nút đăng xuất: style inline trong <head> là ngoại lệ
   lịch sử, nhân nó lên là dựng nguồn sự thật thứ hai cho cùng một nhóm nút.
   MỞ LẠI KHI: đo được ô bị nháy kiểu (FOUC) lúc tải trang thì mới đưa lên inline. */
.bt-tien{height:32px; padding:0 6px; border-radius:8px; flex:none; cursor:pointer;
  border:1px solid var(--side-border); background:transparent; color:var(--side-dim2);
  font-family:inherit; font-size:13px; font-weight:600;
  transition:background .15s, color .12s, border-color .12s}
.bt-tien:hover{background:var(--side-hover); color:var(--side-txt)}
.bt-tien:focus-visible{outline:2px solid var(--cool); outline-offset:1px}
/* Danh sách xổ ra do TRÌNH DUYỆT vẽ, không ăn theo nền ⇒ phải ép màu,
   nếu không chế độ tối cho ra chữ trắng trên nền trắng. */
.bt-tien option{background:var(--panel); color:var(--txt)}

/* Tầng 3 — hàng tab. Hẹp thì XUỐNG DÒNG (không cuộn ngang), không dính khi cuộn — y hình mẫu anh duyệt. */
.hang-tab{display:flex; flex-wrap:wrap; padding:16px 20px 2px}
.hang-tab a{min-width:140px; height:51px; padding:0 14px; display:flex; align-items:center; justify-content:center;
  border:2px solid var(--line); margin:0 -2px -2px 0; font-size:18px; color:var(--txt); text-decoration:none;
  background:var(--panel); white-space:nowrap}
.hang-tab a:hover{color:var(--cool)}
.hang-tab a[aria-current="page"]{color:var(--cool); background:var(--line)}
.hang-tab a:focus-visible{outline:2px solid var(--cool); outline-offset:-2px; position:relative; z-index:1}

.noidung{min-width:0}
.trang{display:none}
.trang.hien{display:block}
/* Số bản ở chân trang (trước nằm cuối menu trái). Máy kiem-bump dò đúng câu chữ, không dò chỗ đứng. */
.chan-trang{padding:28px 20px 32px; font-size:12px; color:var(--dim2); text-align:center}

@media (max-width:560px){
  .t1{padding:0 12px; gap:10px}
  .t1-logo img{display:none}
  .t1-logo .ten{font-size:18px}
  .t1-logo .ten small{font-size:12.5px}
  .t1-nav{gap:10px; font-size:13.5px}
  .hang-tab{padding:12px 12px 2px}
  .hang-tab a{flex:1 1 45%; min-width:0; height:44px; font-size:15px; padding:0 8px}
}

/* (#63) GD nhịp ② — TẦNG 2 `#tang2`: khu #1 bảng + #2 nến dời ra khỏi tab TaiFu, luôn hiện trên hàng tab.
   Kiểu dáng bên trong ăn chung luật `:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) …` (khối "TAB TỔNG HỢP"; #115: khung Markup lại ở `#trTaifu`, bump ở `#trThiTruong`). Chiều cao GIỮ `--khu-h` cũ
   (758px) — thầy 555px, anh từng cố ý nâng (#16) ⇒ chờ anh quyết, đừng tự hạ. */
.tang2{padding:14px 0 0}   /* ghi đè `section{padding:52px 0}` toàn cục — không thì hở 52px trước hàng tab */

/* ============================================================
   TRANG GIAO DỊCH
   ============================================================ */
.tomtat{display:grid; gap:14px; grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
  margin-top:22px}
.o{background:var(--panel); border:1px solid var(--line); border-radius:var(--r);
  padding:17px 19px; box-shadow:var(--shadow); position:relative}
.o .k{font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--dim2);
  padding-right:22px}
.o .v{font-size:24px; font-weight:700; margin-top:7px; letter-spacing:-.02em}
.o .p{font-size:13.5px; color:var(--dim2); margin-top:4px}

/* Nút "?" góc trên-phải mỗi ô số tổng — mở cửa sổ giải thích chỉ số. */
.o-hoi{all:unset; position:absolute; top:10px; right:10px; width:19px; height:19px;
  border-radius:50%; display:flex; align-items:center; justify-content:center;
  font-size:12px; font-weight:700; color:var(--dim2); background:var(--line-soft);
  cursor:pointer; line-height:1}
.o-hoi:hover{background:var(--cool); color:#fff}
.o-hoi:focus-visible{outline:2px solid var(--cool); outline-offset:2px}

/* Nhãn phân tách cụm ô theo Cách B, cùng phong cách với .dongtien .nhan */
.tomtat-nhan{font-size:11.5px; letter-spacing:.11em; text-transform:uppercase;
  color:var(--dim2); font-weight:600; margin-top:22px; margin-bottom:-6px}

/* Cửa sổ giải thích chỉ số — dùng lại khung .hop/.phu-nen, chỉ đổi nội dung */
.tt-hop .than{line-height:1.6; font-size:14px}
.tt-hop .than p{margin:0 0 12px}
.tt-hop .than p:last-child{margin-bottom:0}
.tt-hop .than b{color:var(--txt)}

/* ═══ (#52) HỘP GHI CHÚ (?) — RỘNG GẤP ĐÔI, CHỮ TO HƠN — ÁP CHO CẢ 4 TAB ═══
   Anh giao 16/09/2026: "cửa sổ hiện ghi chú nhỏ quá và phải kéo sâu xuống dưới"
   ⇒ hộp rộng gấp đôi + cỡ chữ tăng 1 số + các số ①②③ in đậm. Anh mở rộng 10:44:
   áp cho CẢ 4 TAB (Chẩn đoán · Tài phú · Danh mục · Tái cân bằng).

   ⛔ VÌ SAO KHÔNG SỬA THẲNG `.hop{max-width:560px}` (dòng ~715):
      `.hop` là khung dùng chung của MỌI cửa sổ bật lên — thêm giao dịch, chọn
      danh mục, nhập số… Nới ở đó là phình to hết mọi ô nhập liệu của trang.
      Nên ba luật dưới đây bó trong `#ghiChuNen`, đúng một hộp ghi chú.
      4 tab dùng chung đúng khung DOM này (`index.html` ~605) nên chỉ cần khai
      MỘT LẦN ở đây là cả 4 cùng ăn — không phải sửa file JS của tab nào.

   ⚠️ `min()` chứ không phải số cứng 1120px: màn hình hẹp (laptop nhỏ, điện
      thoại) thì hộp lấy 92% bề ngang, không bao giờ tràn ra ngoài mép.
   ⚠️ `.cd-gc-bang{min-width:0}` ở dưới (~dòng 1834, vá 16/09) PHẢI GIỮ. Hộp
      rộng ra không cứu được bảng: luật toàn cục `table{min-width:900px}` vẫn ép
      bảng rộng 900px, hộp 1120px thì vừa, nhưng màn hình hẹp là tràn lại ngay.
   Mở lại khi: anh thấy hộp rộng quá, đọc mỏi mắt vì dòng chữ quá dài. */
#ghiChuNen .hop{max-width:min(1120px, 92vw)}
/* Trả về bề rộng cũ cho danh sách "Thêm coin" của tab Tái cân bằng — nó mượn
   chung khung này nhưng KHÔNG phải ghi chú, kéo rộng thì mã coin với giá cách
   nhau cả gang tay. Lớp `gc-hep` do khối nối dây B2 (`index.html`) gắn/gỡ. */
#ghiChuNen .hop.gc-hep{max-width:560px}
#ghiChuNen .tt-hop .than{font-size:14.5px}
/* Số thứ tự ①②③ đầu mỗi đoạn — thẻ do khối nối dây trong `index.html` bọc lúc
   hộp bật lên, KHÔNG sửa vào chuỗi chữ gốc (chữ đó phải trùng từng ký tự với
   `File-MD/PHUONG_PHAP_LUAN_TAB_CHANDOAN_V1.md` §14.7.4 — bộ kiểm canh). */
#ghiChuNen .gc-so{font-weight:700; color:var(--cool)}
/* Chân hộp: câu "NGUỒN CỦA GHI CHÚ NÀY" nay bấm được, mở trang Phương pháp luận */
#ghiChuNen .gc-nguon{color:var(--cool); text-decoration:none; border-bottom:1px dashed currentColor}
#ghiChuNen .gc-nguon:hover{background:var(--cool-soft)}

/* Hero 2 cột: tiêu đề trái, biểu đồ tròn tỷ lệ phải */
.hero-gd{display:flex; gap:28px; align-items:flex-start; justify-content:space-between}
.hero-text{flex:1; min-width:0}
.donut-hop{flex:none; width:508px; background:var(--panel); border:1px solid var(--line);
  border-radius:var(--r); box-shadow:var(--shadow); padding:16px 20px}
.donut-hop:empty{display:none}
.donut-tieu{font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--dim2); margin-bottom:8px}
.donut-body{display:flex; gap:10px; align-items:center}
.donut-ve{position:relative; flex:none}
.donut-svg{width:330px; height:242px; display:block}
.donut-svg path{transition:transform .14s ease; cursor:pointer}
.donut-svg path:hover{transform:translate(var(--dx),var(--dy))}
.dn-nh{font-size:11px; fill:var(--dim); font-weight:600}
/* (#42) Ngoại hình (nền trắng, viền, bóng, chữ) lấy ở khối `.tip-chung` đầu file — ở đây
   chỉ còn phần RIÊNG của bảng này: neo theo khung `.donut-ve`, và nổi cao hơn con trỏ
   150% (thay vì 100%+12px như 2 bảng tab Chẩn đoán) vì nó bám sát miếng bánh. */
.donut-tip{position:absolute; left:0; top:0; pointer-events:none; z-index:5;
  transform:translate(-50%,-150%); opacity:0; transition:opacity .1s}
.donut-tip.hien{opacity:1}
.donut-leg{flex:1; min-width:0; display:flex; flex-direction:column; gap:7px; font-size:13.5px}
.dl{display:flex; align-items:center; gap:8px}
.dl-c{width:11px; height:11px; border-radius:3px; flex:none}
.dl-t{flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
  color:var(--dim); font-variant-numeric:tabular-nums}
.dl-t b{color:var(--txt); font-weight:600}
.donut-cap{margin-top:10px; font-size:14px; font-weight:600; color:var(--txt); text-align:center}
@media (max-width:1100px){ .hero-gd{flex-direction:column} .donut-hop{width:100%; max-width:560px} }
@media (max-width:560px){ .donut-body{flex-direction:column} .donut-hop{width:100%} }

/* ---- Legend + fullscreen + help cho biểu đồ nến (chặng 4.2b) ---- */
/* TradingView-style header */
.bd-head{display:flex; align-items:center; gap:8px; padding:10px 16px 0; flex-wrap:wrap}
.bd-head-r{display:flex; align-items:center; gap:6px; margin-left:auto}
.bd-sel{all:unset; cursor:pointer; font-size:13.5px; font-weight:600; color:var(--txt);
  background:var(--ink); border:1px solid var(--line); border-radius:8px; padding:5px 12px;
  appearance:none; -webkit-appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%2364748B'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 8px center; padding-right:26px}
.bd-sel:focus-visible{outline:2px solid var(--cool); outline-offset:2px}
.bd-icon-btn{all:unset; cursor:pointer; width:30px; height:30px; display:inline-flex;
  align-items:center; justify-content:center; border-radius:6px; color:var(--dim2); font-size:16px}
.bd-icon-btn:hover{background:var(--line-soft); color:var(--txt)}
.bd-icon-btn svg{width:18px; height:18px; stroke:currentColor; fill:none; stroke-width:1.5;
  stroke-linecap:round; stroke-linejoin:round}
.bd-sep{width:1px; height:20px; background:var(--line); flex:none}
.bd-sel-tien{font-size:13px; padding:4px 24px 4px 10px; border-radius:6px}
.bd-legend{display:flex; flex-wrap:wrap; gap:4px 16px; padding:2px 20px 14px}
.bd-leg{all:unset; cursor:pointer; display:inline-flex; align-items:center; gap:6px;
  font-size:13.5px; color:var(--dim); padding:3px 6px; border-radius:6px}
.bd-leg:hover{background:var(--line-soft); color:var(--txt)}
.bd-leg.tat{opacity:.35}
.bd-leg .cham{width:9px; height:9px; border-radius:50%; flex:none}
.bd-toolbar{display:flex; flex-wrap:wrap; align-items:center; padding:2px 20px 12px}
.bd-toolbar-l{display:flex; flex-wrap:wrap; gap:4px 4px; flex:1; min-width:0}
.bd-toolbar-r{display:flex; gap:4px; margin-left:auto; flex:none}
.bd-ohlc-row{padding:0 22px 4px; font-size:13px}
.bd-val-tip{position:absolute; z-index:6; pointer-events:none; display:none;
  background:var(--panel); border:1px solid var(--line); border-radius:8px;
  padding:8px 11px; font-size:13px; line-height:1.7; white-space:nowrap;
  box-shadow:0 4px 14px rgba(0,0,0,.14)}
#bdCard.bd-full{position:fixed; inset:14px; z-index:60; display:flex; flex-direction:column;
  background:var(--panel); border-radius:var(--r); box-shadow:0 20px 60px rgba(0,0,0,.35); overflow:auto}
#bdCard.bd-full .chart{flex:1; height:auto}
body.bd-noscroll{overflow:hidden}
.bd-help-nen{position:fixed; inset:0; z-index:70; background:var(--overlay);
  display:none; align-items:center; justify-content:center}
.bd-help-nen.hien{display:flex}
.bd-help-hop{background:var(--panel); border-radius:16px; max-width:520px; width:92%;
  padding:28px 26px; box-shadow:0 16px 48px rgba(0,0,0,.25); max-height:85vh; overflow-y:auto}
.bd-help-hop h3{margin:0 0 14px; font-size:16px}
.bd-help-hop p{margin:0 0 10px; font-size:14px; line-height:1.7; color:var(--dim)}
.bd-help-hop b{color:var(--txt)}


.thanhcong{display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin:26px 0 14px}
.nut{all:unset; cursor:pointer; padding:9px 16px; border-radius:9px; font-size:13.5px;
  font-weight:600; background:var(--cool); color:#fff}
.nut.phu{background:var(--panel); color:var(--dim); border:1px solid var(--line)}
.nut.phu:hover{color:var(--txt)}
.nut.nho{padding:5px 11px; font-size:13px}
.nut:focus-visible{outline:2px solid var(--txt); outline-offset:2px}
.nut[disabled]{opacity:.5; cursor:default}

.xuat-wrap{position:relative; display:inline-block}
.xuat-mui{font-size:11px; margin-left:2px}
.xuat-menu{position:absolute; top:calc(100% + 6px); left:0; z-index:20; min-width:200px;
  background:var(--panel); border:1px solid var(--line); border-radius:var(--r);
  box-shadow:var(--shadow); padding:6px; display:none}
.xuat-menu.hien{display:block}
.xuat-menu button{all:unset; display:block; width:100%; box-sizing:border-box; cursor:pointer;
  padding:9px 11px; border-radius:7px; font-size:13.5px; color:var(--txt)}
.xuat-menu button:hover{background:var(--line-soft)}

.bang{background:var(--panel); border:1px solid var(--line); border-radius:var(--r);
  box-shadow:var(--shadow); overflow-x:auto}
table{border-collapse:collapse; width:100%; font-size:14px; min-width:900px}
thead th{text-align:left; font-size:12px; letter-spacing:.07em; text-transform:uppercase;
  color:var(--dim); font-weight:700; padding:13px 14px; border-bottom:1px solid var(--line);
  white-space:nowrap}
.ico-hd{vertical-align:middle; display:inline-block}
th.p{text-align:center}
td.p{text-align:right}
tbody td{padding:13px 14px; border-bottom:1px solid var(--line-soft); vertical-align:middle}
tbody tr:last-child td{border-bottom:0}
tr.trade{cursor:pointer}
tr.trade:hover{background:var(--line-soft)}
tr.trade td{font-weight:500}
tr.trade .mo{display:inline-block; width:16px; color:var(--dim2); transition:transform .15s}
tr.trade.mo-ra .mo{transform:rotate(90deg)}
.symbol{font-weight:600}
.symbol small{display:block; font-size:12.5px; font-weight:400; color:var(--dim2)}
.symbol .sym-in{display:flex; align-items:center; gap:9px}
.sym-txt{display:flex; flex-direction:column; line-height:1.25}
.coin-ico-wrap{position:relative; flex:0 0 22px; width:22px; height:22px}
.coin-ico-fb{position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  border-radius:50%; background:var(--line-soft); color:var(--dim2); font-size:11px; font-weight:700}
.coin-ico{position:absolute; inset:0; width:22px; height:22px; border-radius:50%;
  object-fit:cover; background:var(--panel)}
.len{color:var(--up)} .xuong{color:var(--down)}
.hep-td{padding:0 !important; border:0 !important}
.con{background:var(--line-soft); padding:4px 14px 14px}
.con table{min-width:820px; font-size:13.5px}
.con thead th{padding:10px 12px; border-bottom:1px solid var(--line)}
.con tbody td{padding:10px 12px; border-bottom:1px solid var(--line-soft)}
.hd{display:inline-flex; gap:6px}
.hd button{all:unset; cursor:pointer; width:26px; height:26px; border-radius:7px;
  display:grid; place-items:center; color:var(--dim2)}
.hd button:hover{background:var(--panel); color:var(--txt)}
.hd button:focus-visible{outline:2px solid var(--cool)}
.the{display:inline-block; font-size:12px; font-weight:600; padding:2px 9px; border-radius:99px}
.the.mua{background:var(--the-mua-bg); color:var(--up)}
.the.ban{background:var(--the-ban-bg); color:var(--down)}
.the.nap{background:var(--cool-soft); color:var(--cool)}
.the.doi{background:var(--line); color:var(--dim)}
/* NHÃN TĨNH, không phải nút (#27): lối nhập giá tay đi cùng hộp thoại đã gỡ ở index #81.
   Giữ nguyên màu vàng cảnh báo để anh vẫn nhận ra ngay lệnh nào chưa tính được thuế. */
.the.thieu-gia{all:unset; cursor:default; display:inline-flex; align-items:center; gap:4px;
  font-size:12px; font-weight:600; padding:2px 9px; border-radius:99px; white-space:nowrap;
  background:var(--thieu-gia-bg); color:var(--gold)}

/* Mục 2d — hàng tiêu đề bảng chính dính cố định khi cuộn.
   Bảng có vùng cuộn dọc riêng (max-height) để tiêu đề đứng yên, các dòng coin
   trôi lên dưới nó. Chiều cao này có thể chỉnh theo ý. */
/* Mục 2d/điểm 1 — từ "+ Thêm coin mới" trở xuống là một vùng cao gần bằng màn
   hình: thanh công cụ đứng yên trên cùng, bảng cuộn bên trong, hàng tiêu đề cột
   dính ngay dưới thanh công cụ. Kéo trang thì thẻ tổng + dòng tiền cuộn đi. */
.vung-bang{display:flex; flex-direction:column; max-height:calc(100vh - 12px - var(--t1-h, 0px));
  margin-top:14px}
.vung-bang .thanhcong{flex:none; margin-top:0}
.bang{flex:1 1 auto; min-height:0; overflow:auto}
.bang > table > thead > tr > th{position:sticky; top:0; z-index:5;
  background:var(--panel); box-shadow:inset 0 -1px 0 var(--line)}

/* Mục 2e — bảng con: chế độ gọn (hộp cuộn dọc, tiêu đề dính) + phân trang */
.con-scroll{max-height:430px; overflow:auto; border:1px solid var(--line);
  border-radius:10px; background:var(--panel)}
.con-scroll > table{min-width:1040px}
.con-scroll thead th{position:sticky; top:0; z-index:2; background:var(--ink);
  box-shadow:inset 0 -1px 0 var(--line)}
.con thead small{font-weight:600; color:var(--dim2); font-size:9.5px; letter-spacing:.03em}
.con .phi-ma{font-size:11px; color:var(--dim2); font-weight:700}
.con .thue-th, .con .thue-o{padding-right:30px}
.con .gc-th, .con .ghichu-o{min-width:90px; padding-left:12px; white-space:normal}
.con .ghichu-o{max-width:140px}
.con .sangd-o{min-width:70px; max-width:110px; padding-left:12px; white-space:normal}
.con .ngay-gio{white-space:nowrap}
.con-chan{display:flex; gap:10px; flex-wrap:wrap; align-items:center; margin-top:12px}
.con-phantrang{display:flex; align-items:center; justify-content:space-between;
  flex-wrap:wrap; gap:10px; margin-top:10px; padding:2px}
.tr-nhan{font-size:13px; color:var(--dim); font-weight:600}
.tr-nut{display:flex; align-items:center; gap:4px; flex-wrap:wrap}
.tr-so,.tr-dh{all:unset; cursor:pointer; min-width:30px; height:30px; padding:0 9px;
  display:inline-flex; align-items:center; justify-content:center; border-radius:8px;
  font-size:13.5px; color:var(--dim); border:1px solid transparent}
.tr-so:hover,.tr-dh:hover{background:var(--line-soft); color:var(--txt)}
.tr-so.dang{background:var(--cool); color:#fff; font-weight:700}
.tr-dh{color:var(--cool); font-weight:600}
.tr-dh[disabled]{color:var(--line); cursor:default; background:transparent}
.tr-cham{padding:0 3px; color:var(--dim2)}

/* hộp thoại nhập */
/* (#66) GD nhịp ④ — z-index 50 → 80. VÌ SAO: hộp ✎ Giao dịch đứng ở lớp 70/71, mà hộp giải
   thích dùng chung này (`#ghiChuNen`) nằm NGOÀI `#trGiaodich` trong index.html ⇒ để nguyên 50 thì
   bấm dấu (?) bên trong hộp ✎ sẽ mở hiện RA SAU LƯNG tấm nền tối: không thấy chữ nào, và cú bấm
   tiếp rơi trúng nền ⇒ đóng luôn cả hộp Giao dịch. 80 không đụng ai: `.bd-help-nen` 70 · `.tf-full`
   và `.cd-tip` 60 · khung xổ chọn coin 60. ⚠️ Luật này DÙNG CHUNG cho 5 file (portfolio · taifu ·
   chandoan · taicanbang · ngansach) — nâng lên là nâng cho cả 5, đó là ý muốn: hộp giải thích phải
   luôn nằm trên mọi hộp khác. */
.phu-nen{position:fixed; inset:0; background:var(--overlay); z-index:80;
  display:none; align-items:flex-start; justify-content:center; padding:40px 16px; overflow-y:auto}
.phu-nen.hien{display:flex}
.hop{background:var(--panel); border-radius:16px; width:100%; max-width:560px;
  box-shadow:0 20px 50px rgba(15,23,42,.2)}
.hop h3{margin:0; padding:20px 22px; font-size:17px; border-bottom:1px solid var(--line)}
.hop .than{padding:20px 22px}
.hang{display:grid; gap:14px; grid-template-columns:1fr 1fr; margin-bottom:14px}
.o-nhap label{display:block; font-size:12px; letter-spacing:.08em; text-transform:uppercase;
  color:var(--dim2); margin-bottom:6px}
.o-nhap input, .o-nhap select{width:100%; padding:10px 12px; border-radius:9px;
  border:1px solid var(--line); background:var(--ink); color:var(--txt);
  font-family:var(--font); font-size:14px}
.o-nhap input:focus, .o-nhap select:focus{outline:none; border-color:var(--cool)}
.goiy{font-size:13px; color:var(--dim2); margin-top:6px}
.goiy b{color:var(--cool); cursor:pointer; text-decoration:underline}
.o-nhap label small{text-transform:none; letter-spacing:0; font-weight:400; color:var(--dim2)}
.o-phi{display:flex; gap:8px}
.o-phi input{flex:1; min-width:0}
.o-phi > .o-chon{flex:0 0 96px}

/* Ô chọn coin "vừa gõ tìm vừa xổ danh sách" (#25) — thay 3 thẻ <select> cũ.
   Ô nhập bên trong KHÔNG cần rule riêng: nó nằm trong .o-nhap nên đã ăn sẵn
   .o-nhap input ở trên (cùng viền, cùng nền, cùng focus) ⇒ trông y hệt các ô
   khác trong form. Khung danh sách để position:absolute nên KHÔNG đẩy các ô
   phía dưới trôi xuống khi xổ. */
.o-chon{position:relative}
/* min-width + KHÔNG neo right:0 — hai ô coin trả phí chỉ rộng 96px, nếu khung xổ
   ăn đúng bề rộng đó thì mỗi dòng ("BTC … 1,39 T$", .muc để white-space:nowrap)
   tràn ngang và đẻ ra thanh cuộn ngang, phải kéo từng dòng mới đọc được vốn hoá.
   Cho phép khung rộng hơn ô neo là đủ; ô #fMa rộng sẵn nên không đổi gì. */
.o-chon-ds{position:absolute; top:calc(100% + 4px); left:0; min-width:100%;
  width:max-content; max-width:280px; z-index:70;
  display:none; max-height:min(540px, 50vh); overflow-y:auto;
  background:var(--panel); border:1px solid var(--line); border-radius:9px;
  box-shadow:0 12px 28px rgba(15,23,42,.16)}
.o-chon-ds.hien{display:block}
.o-chon-ds .muc{display:flex; align-items:baseline; justify-content:space-between;
  gap:10px; padding:7px 12px; font-size:13.5px; cursor:pointer; white-space:nowrap}
/* .troi = dòng đang trỏ tới bằng phím ↑↓ (khác :hover — dùng chuột hay phím đều thấy) */
.o-chon-ds .muc:hover, .o-chon-ds .muc.troi{background:var(--cool-soft)}
.o-chon-ds .muc b{font-weight:600; color:var(--txt)}
.o-chon-ds .muc i{font-style:normal; font-size:13px; color:var(--dim2)}
/* .cu = vốn hoá cũ hoặc thiếu ⇒ bị dồn xuống cuối bảng, làm mờ cho dễ phân biệt */
.o-chon-ds .muc.cu b{color:var(--dim2); font-weight:400}
.o-chon-ds .trong{padding:10px 12px; font-size:13.5px; color:var(--dim2)}

/* ============================================================
   HÀNG NHẬP GIAO DỊCH NGAY TRÊN BẢNG (#27) — thay hộp thoại đã gỡ ở index #81.
   Đặt NGAY SAU khối .o-chon: ô nhập nằm trong <td> nên phải đè được lên kiểu ô bảng.
   ============================================================ */

/* Khung xổ NỔI: position:fixed để thoát khỏi overflow của .con-scroll (max-height:430px)
   và .bang — hai khung đó sẽ cắt cụt danh sách 334 mã, hoặc làm bảng giãn ngang.
   Toạ độ do portfolio.js đặt (datViTri) vì fixed không bám theo ô cha được. */
.o-chon-ds.noi{position:fixed; top:auto; left:auto; z-index:60}

/* (#31) ĐÃ GỠ toàn bộ luật `.hang-nhap*` — class đó gắn trên "hàng nhập duy nhất", thứ không
   còn được sinh ra nữa (mọi dòng nháp nay dùng chung `.hang-cho`). Biến `--hang-nhap-nen` vẫn
   giữ ở `:root` cho lượt dọn riêng có bộ kiểm canh. */

/* DÒNG NHÁP (#28) — đã gõ nhưng CHƯA gửi lên máy chủ. Nền vàng để phân biệt ngay
   bằng mắt với các dòng đã có thật trong sổ: nhìn nhầm là tưởng đã lưu rồi. */
.hang-cho > td{background:var(--hang-cho-nen); border-top:1px dashed var(--hang-cho-vien);
  border-bottom:1px dashed var(--hang-cho-vien)}
.hang-cho > td:first-child{border-left:2px solid var(--hang-cho-vien); border-radius:8px 0 0 8px}
.hang-cho > td:last-child{border-right:2px solid var(--hang-cho-vien); border-radius:0 8px 8px 0}
.hang-cho .hn-stt{color:var(--hang-cho-vien); font-weight:700}
/* Dòng gõ sai khi bấm Lưu: viền đỏ liền, để anh biết phải sửa đúng dòng nào. */
.hang-cho.cho-loi > td{border-top-color:var(--down); border-bottom-color:var(--down); border-top-style:solid; border-bottom-style:solid}
.hang-cho.cho-loi > td:first-child{border-left-color:var(--down)}
.hang-cho.cho-loi > td:last-child{border-right-color:var(--down)}
/* (#31) ĐÃ GỠ `.hang-nhap.cho-loi` — không còn "dòng đang gõ" riêng để mà tô. */

/* ---- (#30) SỔ NHÁP V2 — mockup anh duyệt 24/08/2026 ---- */
/* Dòng bị máy chủ chỉ mặt: nền HỒNG hẳn, không chỉ viền. Trong một bảng đã toàn dòng nền
   vàng, đổi mỗi màu viền là quá kín — anh phải soi mới thấy. */
.hang-cho.cho-loi > td{background:var(--down-soft)}
.hang-cho.cho-loi .ngay-gio,
.hang-cho.cho-loi > td:nth-child(3){color:var(--down); font-weight:700}

/* Nhãn nhỏ cạnh mã coin: "sửa" / "xoá" / "dòng N".
   (#32) Nhãn "nháp" ĐÃ GỠ (anh chốt 25/08) — nền vàng của cả dòng đã nói đúng điều đó rồi.
   Luật gốc `.the-nhap` vẫn cần: ba biến thể dưới đây kế thừa hình dáng từ nó. */
.the-nhap{display:inline-block; padding:1px 7px; border-radius:999px; font-size:11.5px;
  font-weight:700; letter-spacing:.02em; vertical-align:middle;
  background:var(--hang-cho-nen); color:var(--hang-cho-vien);
  border:1px solid var(--hang-cho-vien)}
.the-nhap.the-sua{background:var(--cool-soft); color:var(--cool); border-color:var(--cool)}
.the-nhap.the-xoa{background:var(--line); color:var(--dim); border-color:var(--dim)}
/* "dòng N" — đỏ, vì nó chính là thứ hộp báo lỗi vừa nhắc tới. */
.the-nhap.the-loi{background:var(--down-soft); color:var(--down); border-color:var(--down)}
.the.xoa{background:var(--line); color:var(--dim)}
.hang-cho-xoa > td{font-style:italic}

/* ---- (#31) BẢNG NHẬP "Ô SỐNG" — anh chốt 25/08/2026 ---- */
/* Dòng nháp nay chứa ô nhập thật, cần chỗ thở như .hang-nhap cũ chứ không bó như dòng chữ. */
.hang-cho-song > td{padding:8px 10px !important}

/* Nút chữ "Huỷ xoá" trên dòng nháp loại xoá (ảnh 1 anh gửi 25/08). Dùng CHỮ chứ không phải
   biểu tượng 🗑: một cái thùng rác trên dòng vốn đã là "sẽ xoá" đọc ra hai nghĩa ngược nhau. */
.nut-link{background:none; border:0; padding:2px 4px; cursor:pointer; font:inherit;
  font-size:13px; font-weight:700; white-space:nowrap;
  color:var(--hang-cho-vien); text-decoration:underline; text-underline-offset:2px}
.nut-link:hover:not(:disabled){color:var(--down)}
.nut-link:disabled{opacity:.45; cursor:default; text-decoration:none}

/* Ô đang mang lỗi cục bộ (mã coin mới trùng coin đã có) — viền đỏ ngay tại ô, không phải
   chờ bấm Lưu mới biết. */
.hang-cho.cho-loi .hn-o{border-color:var(--down)}
/* Câu báo lỗi của một KHỐI coin mới, nằm ngay dưới bảng của khối đó. */
.hn-loi-o{margin:8px 0 0; padding:8px 11px; border-radius:8px; font-size:13.5px;
  font-weight:600; background:var(--down-soft); color:var(--down);
  border:1px solid var(--down)}

/* Khung báo lỗi CHUNG, đặt ngoài bảng ngay dưới thanh công cụ (trước nằm trong một hàng phụ
   bám dưới "hàng nhập duy nhất" — hàng đó không còn).
   ⚠️ GIỮ nguyên cơ chế ẩn/hiện của `.loi` (display:none + class `.hien` do baoLoi() bật) —
   chỉ đè lại lề cho hợp chỗ đứng mới. Đặt `display` ở đây là đè mất cơ chế đó, khung lỗi sẽ
   nằm chình ình cả khi không có lỗi nào. */
#hnLoi{margin:0 0 10px; padding:9px 12px; border-radius:8px; font-size:13.5px; font-weight:600}

/* Cụm bên PHẢI thanh công cụ: chỉ báo "N dòng chưa lưu" + nút Lưu nháp, dồn sát lề phải. */
.tc-phai{margin-left:auto; display:inline-flex; align-items:center; gap:10px}
.hn-dem{display:inline-flex; align-items:center; padding:5px 11px; border-radius:999px;
  font-size:13px; font-weight:600; white-space:nowrap;
  background:var(--hang-cho-nen); color:var(--hang-cho-vien);
  border:1px solid var(--hang-cho-vien)}

/* (#32) ĐÃ GỠ `.dm-chan` — dòng "N mã · P2P …" ở chân bảng, anh chốt 25/08/2026 là không cần
   nữa. Gỡ cả luật lẫn chỗ dựng HTML (`portfolio.js` #15) để không còn class mồ côi. */

/* Ô nhập trong hàng: mặc định là ô TRẮNG (anh nhập tay). */
.hn-o{width:100%; min-width:64px; padding:7px 9px; border-radius:7px;
  border:1px solid var(--line); background:var(--panel); color:var(--txt);
  font-family:var(--font); font-size:13.5px}
.hn-o:focus{outline:none; border-color:var(--cool); box-shadow:0 0 0 3px var(--cool-soft)}
/* ⚠️ (#31) Neo vào `td.p` chứ KHÔNG vào class của hàng. Bản #30 viết `.hang-nhap td.p .hn-o`,
   mà `.hang-nhap` đã bị gỡ cùng "hàng nhập duy nhất" — luật chết, mọi số trong dòng nháp canh
   TRÁI trong khi tiêu đề cột canh phải. Đây là bảng tiền: đầu cột phải mà số trái là đọc lệch
   cột. Neo vào `td.p` thì áp đúng cho mọi dòng nháp, ở cả bảng con lẫn khối coin mới. */
td.p .hn-o{text-align:right}
td.p .hn-o[type="datetime-local"]{text-align:left}
/* Ẩn mũi tên tăng/giảm của ô số: với số lượng coin (0,00002341) bấm mũi tên là vô nghĩa,
   mà chúng ăn ~15px bề ngang khiến số dài bị cắt cụt ngay giữa bảng — nhìn như sai số. */
.hn-o[type="number"]{-moz-appearance:textfield}
.hn-o[type="number"]::-webkit-outer-spin-button,
.hn-o[type="number"]::-webkit-inner-spin-button{-webkit-appearance:none; margin:0}

/* (#32) ĐÃ GỠ `.o-tudien` (nền vàng + viền cam "🟡 máy tự điền" trên ô Giá vốn/Giá bán) —
   anh chốt 25/08/2026: hai ô đó để TRẮNG như mọi ô nhập tay. Class cũng đã gỡ khỏi chỗ dựng
   HTML (`portfolio.js` #15, hai chỗ: hnOGiua + veOGia).
   Hai biến `--o-tudien-nen/-vien` vẫn nằm ở `:root` (sáng + tối) — giữ nguyên theo đúng tiền
   lệ `--hang-nhap-nen` ở #31: dọn biến màu là lượt riêng, cần bộ kiểm canh cả hai bảng màu. */
/* ⬜ MÁY TỰ TÍNH — Giá trị · Thuế tạm tính. Viền đứt để nhìn là biết không gõ được. */
.o-tutinh{background:var(--o-tutinh-nen); border-style:dashed; color:var(--dim); cursor:default}
/* Vế Giá vốn/Giá bán đang bị khoá theo Loại — hiện dấu — */
.hn-trong{display:block; text-align:center; color:var(--dim2)}

/* ---- (#32) Ô MUA/BÁN + cột Coin của khối coin mới — anh chốt 25/08/2026 (ảnh 1) ---- */
/* Ô xổ Mua/Bán: XANH khi Mua, ĐỎ khi Bán. Tô thẳng lên ô, không bọc vỏ `.the` ra ngoài — ô
   `<select>` có nền riêng nên nó đè kín nền vỏ, chỉ còn lộ quầng viền (xem hnLoaiChon #15). */
.o-loai{min-width:0; font-weight:700; cursor:pointer}
.o-loai.mua{background:var(--the-mua-bg); color:var(--up); border-color:var(--the-mua-bg)}
.o-loai.ban{background:var(--the-ban-bg); color:var(--down); border-color:var(--the-ban-bg)}
.o-loai:disabled{opacity:.5; cursor:default}
/* Danh sách xổ ra phải trở về màu chữ thường: trên Windows, Chrome tô CẢ hai mục theo `color`
   của `<select>` ⇒ đang là Mua thì cả mục "Bán" cũng hiện màu xanh, nói ngược nội dung. */
.o-loai option{color:var(--txt); background:var(--panel); font-weight:600}

/* Cột đầu của MỌI dòng nháp: ô Mua/Bán + (mã coin) + nhãn, xếp NGANG trên một dòng.
   ⚠️ Bọc cả ở BẢNG CON, nơi chỉ có ô Mua/Bán + nhãn: `.hn-o` mang `width:100%` nên ô xổ để
   trần trong `<td>` căng hết cột và đẩy nhãn "sửa"/"dòng N" xuống dòng dưới, dòng cao gấp đôi.
   Ô coin co giãn (nó mang chữ dài "Chọn coin…"), ô Mua/Bán ghim 82px — để nó co theo là chữ
   "Bán" bị cắt còn "Bá". */
.hn-coin{display:flex; gap:6px; align-items:center}
.hn-coin > .hn-chon{flex:1 1 auto; min-width:88px}
.hn-coin > .o-loai{flex:0 0 82px}
/* Mã coin dạng chữ ở các dòng SAU trong khối — không co, không xuống dòng giữa chừng. */
.hn-coin > b{flex:0 0 auto; white-space:nowrap; font-size:13.5px}
/* Nhãn "sửa" / "dòng N": không co, không bị đẩy xuống dòng. */
.hn-coin > .the-nhap{flex:0 0 auto}

/* 2 ô phí: ô SỐ rộng (min 94px) + ô ĐƠN VỊ hẹp (50px) — đúng mockup anh đã duyệt. */
.hn-phi{display:flex; gap:5px; align-items:center}
.hn-phi > .hn-o{flex:1 1 auto; min-width:94px}
.hn-phi > .hn-chon{flex:0 0 50px}
.hn-chon{position:relative}
.hn-chon .hn-o{min-width:0}

/* (#31) ĐÃ GỠ `.hang-nhap-phu` và `.hn-nhac` — dòng phụ bám dưới "hàng nhập duy nhất" (nhắc
   số dư · gợi ý giá · báo lỗi) đã bỏ hẳn từ #13/#14. Khung lỗi nay là `#hnLoi` ngoài bảng. */

/* Nút "✓ Lưu giao dịch" — xanh lá, dồn về góc phải hàng chân bảng con. */
.nut-luu{margin-left:auto; background:var(--up)}
.nut-luu:hover{filter:brightness(1.06)}

/* DẢI NHẬP COIN MỚI ở đầu bảng tổng — chiếm hết bề ngang, có tiêu đề riêng.
   (Bảng tổng có 11 cột tiêu đề hoàn toàn khác, ép hàng nhập vào đó thì ô Ngày rơi
   dưới tiêu đề "Thuế" — đọc là nhầm ngay, mà đây là bảng tiền.) */
.hn-dai{background:var(--line-soft); padding:4px 14px 12px}
/* (#32) 1040 → 1128px: cột Coin nở 148 → 236px cho ô Mua/Bán. Con số này là SÀN bề ngang —
   để nguyên 1040 thì không hỏng gì, nhưng nó thôi nói đúng bề ngang tối thiểu thật. */
.hn-bang{width:100%; min-width:1128px; border-collapse:collapse; font-size:13.5px}
.hn-bang thead th{padding:10px 10px; border-bottom:1px solid var(--line);
  font-size:11.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--dim2);
  text-align:left; white-space:nowrap}
.hn-bang thead th.p{text-align:right}
.hn-bang thead small{font-weight:600; color:var(--dim2); font-size:9.5px; letter-spacing:.03em}
/* Nút Lưu nằm trong HÀNG RIÊNG ngay dưới hàng nhập, dồn phải — anh chốt: mắt không
   phải rời khỏi chỗ đang gõ để đi tìm nút. */
.hn-chan{display:flex; justify-content:flex-end; padding-top:10px}
/* Chữ bấm được trong khung báo lỗi đỏ (nút "Thử lại" khi tải danh sách coin hỏng) */
.loi b{cursor:pointer; text-decoration:underline}
.hop .chan{padding:16px 22px; border-top:1px solid var(--line); display:flex;
  gap:10px; justify-content:flex-end}
.loi{margin:0 22px 14px; padding:11px 14px; border-radius:9px; background:var(--loi-bg);
  color:var(--down); font-size:13.5px; display:none}
.loi.hien{display:block}
@media (max-width:560px){ .hang{grid-template-columns:1fr} }

/* nhắc đồng bộ */
.nhac{display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-top:22px;
  padding:13px 16px; border-radius:var(--r); background:var(--nhac-bg);
  border:1px solid var(--nhac-border); color:var(--nhac-txt); font-size:13.5px}
.nhac b{font-weight:700}
.nhac .nut{margin-left:auto; background:var(--gold)}

/* băng vàng: các chỗ số dư ÂM còn sót trong sổ (máy chủ trả trường diemAm).
   Dùng LẠI bộ biến --nhac-* thay vì khai bộ mới: đã đủ 2 theme và đúng nghĩa "nhắc anh
   xử lý". KHÔNG dùng --hang-cho-* vì đó là màu của HÀNG trong bảng — đổi màu dòng chờ
   sẽ kéo băng này đổi theo. Khai bộ riêng chỉ khi nào băng và dòng chờ cần hai sắc thái
   khác nhau; hiện chưa có nhu cầu đó.
   KHÔNG đặt display cứng: băng do JS dựng chuỗi rỗng để ẩn, không bật/tắt bằng class. */
.canh-bao-am{margin:0 0 18px; padding:13px 16px; border-radius:var(--r);
  background:var(--nhac-bg); border:1px solid var(--nhac-border); color:var(--nhac-txt);
  font-size:13.5px}
.canh-bao-am b{font-weight:700}
.canh-bao-am ul{margin:8px 0 0; padding-left:20px}
.canh-bao-am li{margin-top:3px; line-height:1.5}
.canh-bao-am i{font-style:normal; opacity:.75}
.tomtat.mo-di{opacity:.55}
.dv{font-size:12px; color:var(--dim2); margin-left:3px}
.dongtien{display:flex; align-items:center; gap:8px 26px; flex-wrap:wrap;
  margin-top:14px; padding:14px 20px; background:var(--panel);
  border:1px solid var(--line); border-radius:var(--r); box-shadow:var(--shadow)}
.dongtien .nhan{font-size:11.5px; letter-spacing:.11em; text-transform:uppercase;
  color:var(--dim2); font-weight:600; padding-right:6px; border-right:1px solid var(--line);
  display:inline-flex; align-items:center; gap:6px}
.nhan-hoi{all:unset; width:15px; height:15px; border-radius:50%; display:inline-flex;
  align-items:center; justify-content:center; font-size:9.5px; font-weight:700;
  color:var(--dim2); background:var(--line-soft); cursor:pointer; line-height:1}
.nhan-hoi:hover{background:var(--cool); color:#fff}
.nhan-hoi:focus-visible{outline:2px solid var(--cool); outline-offset:2px}
.dongtien span{display:flex; align-items:baseline; gap:8px}
.dongtien i{font-style:normal; font-size:13.5px; color:var(--dim)}
.dongtien b{font-size:15px; font-weight:600; font-variant-numeric:tabular-nums}
@media (max-width:760px){
  .dongtien{gap:10px 18px}
  .dongtien .nhan{width:100%; border-right:0; border-bottom:1px solid var(--line);
    padding:0 0 8px}
}

/* đầu cột bấm để sắp xếp — dùng chung cho bảng chính (th.xep) và bảng con (th.xepcon) */
th.xep, th.xepcon{cursor:pointer; user-select:none; white-space:nowrap}
th.xep:hover, th.xepcon:hover{color:var(--txt)}
th.xep .mui, th.xepcon .mui{display:inline-block; margin-left:5px; font-size:9px; color:var(--line);
  vertical-align:1px}
th.xep:hover .mui, th.xepcon:hover .mui{color:var(--dim2)}
th.xep.dang, th.xepcon.dang{color:var(--cool)}
th.xep.dang .mui, th.xepcon.dang .mui{color:var(--cool); font-size:8px}


/* ============================================================
   TAB TAIFU INDEX (Bước 4) — TẤT CẢ scope bằng #trTaifu để không rò tab khác
   ============================================================ */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-sec{margin-top:26px}
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-sec-tt{font-size:13.5px; font-weight:700; letter-spacing:.02em; color:var(--txt);
  margin:0 0 10px; display:flex; align-items:baseline; gap:8px; flex-wrap:wrap}
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-sec-tt small{font-size:12.5px; font-weight:500; color:var(--dim2); letter-spacing:0}

/* bảng chung cho #1 và #2 (dùng .bang/.card + table gốc, chỉ tinh chỉnh) */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-bang table{min-width:720px; font-size:13.5px}
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-bang thead th{padding:11px 12px}
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-bang tbody td{padding:11px 12px}
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-bang td.p, :is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-bang th.p{text-align:right}
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-ten b{font-weight:600}
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-ten small{display:block; font-size:12px; color:var(--dim2); font-weight:400; letter-spacing:.02em}
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-sym b{font-weight:600}
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-sym small{display:block; font-size:12px; color:var(--dim2); font-weight:400}
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .mo-nhat{color:var(--dim2)}

/* #1: dòng chỉ số bấm được + đang chọn */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) tr.tf-chiso{cursor:pointer}
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) tr.tf-chiso:hover{background:var(--line-soft)}
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) tr.tf-chiso.chon{background:var(--cool-soft)}
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) tr.tf-chiso.chon td:first-child{box-shadow:inset 3px 0 0 var(--cool)}

/* #2: dòng USD (ammo) + dòng tổng */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) tr.tf-usd td{color:var(--dim); background:var(--line-soft)}
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) tr.tf-tong td{border-top:2px solid var(--line); font-weight:600; background:var(--panel)}

/* #3: header + zoom + biểu đồ (tái dùng .bd-head/.bd-sel/.tf) */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-chart-head{display:flex; align-items:center; gap:8px; padding:12px 16px 0; flex-wrap:wrap}
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-zoom{display:flex; gap:2px; background:var(--line-soft); padding:3px; border-radius:10px;
  border:1px solid var(--line); flex-wrap:wrap}
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-zoom button{all:unset; cursor:pointer; padding:6px 12px; border-radius:7px;
  font-size:13px; font-weight:600; color:var(--dim); transition:.15s}
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-zoom button:hover{color:var(--txt)}
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-zoom button[aria-pressed="true"]{background:var(--cool); color:#fff}
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-ohlc{display:flex; gap:14px; flex-wrap:wrap; font-size:13px; color:var(--dim);
  padding:8px 22px 0}
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-ohlc b{font-weight:600}
/* (#128) Mọi luật của ô biểu đồ nến `#tfChart` / thẻ `#tfChartCard` mở sang lớp chung `.tf-chart-box` / `.tf-chart-card` bằng `:is(#id,.lớp)` — `:is()` lấy độ nặng của
   nhánh nặng nhất (id) ⇒ biểu đồ nến từng coin ở khu #4 (`#coinChart` trong `#coinChartCard`) ăn ĐÚNG các luật này với ĐÚNG độ nặng cũ; biểu đồ trên không đổi gì. */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) :is(#tfChart,.tf-chart-box){height:460px; margin:6px 10px 0}
@media (max-width:760px){ :is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) :is(#tfChart,.tf-chart-box){height:360px} :is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-bang table{min-width:640px} }


/* ==========================================================================
   B1 — TAB TỔNG HỢP: lưới 5 khu / 3 tầng + nút thu gọn (scope toàn bộ #trTaifu)
   ========================================================================== */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-tang{
  display:grid; grid-template-columns:1fr 1fr; gap:22px;
  align-items:start; margin-top:26px;
}
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-tang3{ grid-template-columns:1fr; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-khu{ position:relative; min-width:0; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-khu .tf-sec-tt{ margin:0 0 10px; }
/* bảng trong lưới: cho co theo cột (min-width:720px chỉ hợp khi xếp dọc); tràn thì .bang tự cuộn */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-khu .tf-bang table{ min-width:0; }

/* nút thu gọn (góc phải-trên khu trái) */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-thu{
  position:absolute; top:8px; right:8px; z-index:4;
  width:26px; height:26px; padding:0; border-radius:8px; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  border:1px solid var(--line); background:var(--panel);
  color:var(--dim); font-size:16px; line-height:1; transition:.15s;
}
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-thu:hover{ color:var(--txt); border-color:var(--cool); }

/* trạng thái thu gọn: cột trái còn thanh mảnh, khu phải nở chiếm chỗ */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-tang.thu{ grid-template-columns:42px 1fr; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-tang.thu > .th-khu:first-child{ min-height:130px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-tang.thu > .th-khu:first-child > :not(.th-thu){ display:none; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-tang.thu > .th-khu:first-child .th-thu{ transform:rotate(180deg); right:7px; }

/* placeholder #4 / #5 (chờ B3) */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-cho{ padding:24px; min-height:120px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-cho-tt{ font-weight:600; font-size:14px; color:var(--txt); margin-bottom:6px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-cho-mo{ margin:0; font-size:13.5px; color:var(--dim); line-height:1.55; }

/* mobile: về 1 cột, ẩn nút thu gọn (mở lại nội dung bị ẩn khi thu) */
@media (max-width:900px){
  :is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-tang, :is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-tang.thu{ grid-template-columns:1fr; }
  :is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-tang.thu > .th-khu:first-child > :not(.th-thu){ display:block; }
  :is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-thu{ display:none; }
}


/* ==========================================================================
   B1 TINH CHỈNH (sau test máy): tràn viền + chữ nhỏ + #3 hiện ~15 coin
   ========================================================================== */
/* (a) tràn viền rộng như tab Giao dịch (bỏ giới hạn 1120px của .wrap) */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .wrap{ max-width:none; }

/* (b) chữ bảng nhỏ + padding gọn -> hiện nhiều cột hơn theo hàng ngang */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-khu .tf-bang table{ font-size:13px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-khu .tf-bang thead th{ padding:8px 9px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-khu .tf-bang tbody td{ padding:7px 9px; }

/* (c) #3 mặc định cao ~15 coin rồi cuộn dọc; tiêu đề cột dính khi cuộn xuống.
   (Số coin chính xác 15 + nút "xem thêm" sẽ làm gọn trong taifu.js ở B2.) */
#trTaifu .th-3 .bang{ max-height:640px; overflow:auto; }
#trTaifu .th-3 .tf-bang thead th{ position:sticky; top:0; background:var(--panel); z-index:2; }


/* ===== B2a: thanh điều khiển biểu đồ #2 (nút nến/đường, USD/VND) + cột STT #1 ===== */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-nut{
  all:unset; cursor:pointer; display:inline-flex; align-items:center; justify-content:center;
  min-width:30px; height:28px; padding:0 8px; border-radius:8px;
  border:1px solid var(--line); color:var(--dim); font-size:15px; transition:.15s;
}
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-nut:hover{ color:var(--txt); border-color:var(--cool); }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-tien-wrap{ display:inline-flex; align-items:center; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-stt{ width:1%; white-space:nowrap; text-align:right; color:var(--dim2); }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) tr.tf-dm td.tf-ten small{ color:var(--cool); }


/* ===== B2b: 4 nút chức năng dưới biểu đồ + phóng to toàn màn hình (#trTaifu) ===== */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-legend{ display:flex; gap:6px; flex-wrap:wrap; padding:8px 16px 2px; }
:is(#trTaifu,#tang2,#trThiTruong,#trQuy) .tf-leg{
  all:unset; cursor:pointer; display:inline-flex; align-items:center; gap:6px;
  padding:5px 10px; border-radius:8px; border:1px solid var(--line);
  font-size:13px; color:var(--txt); transition:.15s;
}
:is(#trTaifu,#tang2,#trThiTruong,#trQuy) .tf-leg:hover{ border-color:var(--cool); }
:is(#trTaifu,#tang2,#trThiTruong,#trQuy) .tf-leg.tat{ opacity:.42; }
:is(#trTaifu,#tang2,#trThiTruong,#trQuy) .tf-leg .cham{ width:10px; height:10px; border-radius:3px; display:inline-block; flex:none; }

/* Phóng to toàn màn hình cho card biểu đồ #2 */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) :is(#tfChartCard,.tf-chart-card).tf-full{
  position:fixed; inset:16px; z-index:60; margin:0; max-width:none;
  box-shadow:0 20px 60px rgba(0,0,0,.35); overflow:auto;
}
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) :is(#tfChartCard,.tf-chart-card).tf-full :is(#tfChart,.tf-chart-box){ height:calc(100vh - 210px); }


/* ===== B3b: biểu đồ #2 — lấp ĐẦY chiều rộng (cột giá sát lề); chiều cao 4:3 do taifu.js tính ===== */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) :is(#tfChart,.tf-chart-box){ width:100%; margin:0; height:520px; aspect-ratio:auto; min-height:0; max-height:none; }


/* ===== B3b tinh chỉnh: đầu khung chart Markup (#4) — markup% trái, tỷ giá phải ===== */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .mk-head{ display:flex; justify-content:space-between; align-items:flex-start; gap:12px 22px; flex-wrap:wrap; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .mk-head-left{ display:flex; align-items:baseline; gap:18px; flex-wrap:wrap; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .mk-markup{ font-size:30px; font-weight:700; line-height:1; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .mk-head-right{ display:grid; grid-template-columns:auto auto auto; gap:5px 14px; align-items:baseline; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .mk-rate-lab{ color:var(--dim); font-size:13.5px; white-space:nowrap; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .mk-rate-val{ font-weight:600; font-size:14px; text-align:right; white-space:nowrap; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .mk-rate-chg{ font-size:13.5px; text-align:right; min-width:74px; white-space:nowrap; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .mk-hidden{ display:none; }
@media (max-width:640px){
  :is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .mk-head-right{ justify-self:start; }
  :is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .mk-markup{ font-size:24px; }
}


/* ==========================================================================
   GIAI ĐOẠN 2 (#10 — 2026-08-07): thanh nút A/B/C ở #3 + bảng Top 100 / Loại trừ
   ========================================================================== */
/* Thanh nút A/B/C */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-tab3{ display:flex; align-items:center; gap:6px; margin:2px 0 8px; flex-wrap:wrap; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-tab3-nut{ font:inherit; font-size:13px; padding:5px 12px; border:1px solid var(--line); border-radius:999px; background:var(--panel); color:var(--dim); cursor:pointer; transition:.15s; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-tab3-nut:hover{ background:var(--line-soft); }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-tab3-nut.chon{ background:var(--cool-soft); border-color:var(--cool); color:var(--cool); font-weight:600; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-tab3-msg{ font-size:13px; color:var(--dim2); margin-left:4px; }
/* Ô thông báo của tab Quản lý coin BỊ ẨN MẤT mỗi khi báo lỗi — vá 21/08/2026.
   taifu.js gắn class `loi` lên #tfTab3Msg để tô đỏ, nhưng `.loi` là class của KHUNG
   BÁO LỖI trong form giao dịch, mà khung đó `display:none` (chỉ hiện khi có thêm
   `.hien`). Rule cũ ở đây chỉ khai `color` nên không gỡ được `display:none` ⇒ mọi
   thông báo LỖI của tab Quản lý coin biến mất đúng lúc cần thấy nhất, nhìn như treo.
   Vá tại CSS (không đụng taifu.js) nên không phải bump thêm file. Phải khử luôn nền,
   đệm, lề của `.loi` — thừa hưởng nguyên si thì span nhỏ này hoá ra một khối đỏ to.
   Đây đúng loại bẫy TRÙNG TÊN CLASS đã trả giá với `.tf-tt` (xem header bản #22). */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-tab3-msg.loi{ color:var(--down); display:inline;
  background:none; margin:0 0 0 4px; padding:0; border-radius:0; font-size:13px; }

/* ==========================================================================
   #56 (K-12 GĐ3): "BẢNG CHÍNH" danh mục = clone tab Component của thầy.
   Gồm: thanh 2 nút chế độ xem · bảng 12 cột · 3 dải giỏ + dòng tổng từng giỏ.
   Mockup: File-MD/mockups/mockup_bangchinh_component.png
   ========================================================================== */

/* Thanh 2 nút chế độ — dùng lại y hệt hình dáng của .tf-tab3-nut ngay trên.
   (#115: không còn là hàng thứ hai — hai nút nay nằm TRONG hàng `#tfTab3` của khu #3, xem luật ngay dưới.) */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-cd{ display:flex; align-items:center; gap:6px; margin:0 0 8px; flex-wrap:wrap; }
/* (#115) Hai nút chế độ nay nằm TRONG hàng `#tfTab3` (index.html #256, thay chỗ ba nút mặt A/D/E) ⇒ bỏ lề dưới của hàng riêng cũ. */
#tfTab3 #tfCheDo{ margin:0; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-cd-nut{ font:inherit; font-size:13px; padding:5px 12px; border:1px solid var(--line); border-radius:999px; background:var(--panel); color:var(--dim); cursor:pointer; transition:.15s; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-cd-nut:hover{ background:var(--line-soft); }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-cd-nut.chon{ background:var(--cool-soft); border-color:var(--cool); color:var(--cool); font-weight:600; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-cd-hoi{ font:inherit; font-size:12px; line-height:1; width:19px; height:19px; padding:0; border:1px solid var(--line); border-radius:50%; background:var(--panel); color:var(--dim2); cursor:pointer; transition:.15s; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-cd-hoi:hover{ background:var(--cool); border-color:var(--cool); color:#fff; }
/* Dấu (?) của dòng TỔNG — đặt ngay cạnh chữ TỔNG chứ không làm nút riêng trên thanh
   công cụ, vì mockup đã duyệt không vẽ nút đó, và chỗ anh thắc mắc chính là dòng này. */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-tong-hoi{ font:inherit; font-size:11px; line-height:1; width:16px; height:16px; padding:0; margin-left:6px; border:1px solid var(--line); border-radius:50%; background:var(--panel); color:var(--dim2); cursor:pointer; vertical-align:middle; transition:.15s; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-tong-hoi:hover{ background:var(--cool); border-color:var(--cool); color:#fff; }

/* 12 cột nên bảng rộng -> cho cuộn ngang thay vì bóp chữ (ghi đè min-width:0 của .th-khu),
   y như cách bảng Top 100 ngay trên đang làm. */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-khu .tf-bang table.tf-b-dm{ min-width:1080px; }
/* Tiêu đề 2 dòng: "% Tổng" trên, "(mốc dd/mm/yyyy) ↓" xuống dòng dưới, chữ nhỏ hơn. */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-bang table.tf-b-dm thead th small{ display:block; font-size:11px; font-weight:400; color:var(--dim2); letter-spacing:.02em; }

/* Ba dải giỏ. Màu ĐẶT CỨNG chứ không dùng biến chủ đề: đây là màu nhận dạng giỏ
   (xanh lá = Ammo · lam đậm = HOLD · lam nhạt = 2 giỏ con) copy theo thầy, và chữ
   trắng đọc rõ trên cả nền sáng lẫn nền tối nên không cần đảo màu theo chủ đề. */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-bang tr.tf-gio td{ color:#fff; font-weight:600; font-size:13px; letter-spacing:.02em; padding:8px 12px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-bang tr.tf-gio.g-ammo td{ background:#2F9E4F; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-bang tr.tf-gio.g-hold td{ background:#3B4EE0; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-bang tr.tf-gio.g-con  td{ background:#7C8CF8; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-gio-hoi{ font:inherit; font-size:11px; line-height:1; width:16px; height:16px; padding:0; margin-left:8px; border:1px solid rgba(255,255,255,.65); border-radius:50%; background:transparent; color:#fff; cursor:pointer; vertical-align:middle; transition:.15s; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-gio-hoi:hover{ background:#fff; color:#333; }

/* Dòng "Tổng" của TỪNG giỏ — nhạt hơn dòng TỔNG chung (tr.tf-tong) để nhìn ra ngay
   cái nào là tổng con, cái nào là tổng cuối bảng. */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-bang tr.tf-gtong td{ border-top:1px solid var(--line); background:var(--line-soft); font-weight:600; }
/* Dòng ghi chú cảnh báo mốc thiếu giá (chạy hết chiều ngang, chữ nhỏ). */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-bang tr.tf-ghi td{ font-size:12px; color:var(--dim2); background:var(--line-soft); white-space:normal; line-height:1.5; }
/* Bảng Top 100 rộng -> cho cuộn ngang thay vì bóp (ghi đè min-width:0 của .th-khu) */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-khu .tf-bang table.tf-b-top100{ min-width:560px; }

/* Coin bị loại trừ: chữ mờ + gạch symbol; badge + nút giữ rõ (dùng màu, KHÔNG dùng opacity) */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-bang tr.tf-loai td{ color:var(--dim2); }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-bang tr.tf-loai .tf-sym b{ text-decoration:line-through; color:var(--dim2); }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-badge{ display:inline-block; font-size:11px; line-height:1; padding:2px 5px; margin-left:6px; border-radius:4px; background:var(--down); color:#fff; vertical-align:middle; }

/* Nút Loại / Bỏ trên từng dòng */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-act{ text-align:right; white-space:nowrap; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-loai-nut{ font:inherit; font-size:12px; padding:3px 9px; border:1px solid var(--line); border-radius:6px; background:var(--panel); color:var(--dim); cursor:pointer; white-space:nowrap; transition:.15s; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-loai-nut:hover{ border-color:var(--cool); color:var(--cool); }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-loai-nut.bo{ color:var(--down); border-color:var(--down); }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-loai-nut.bo:hover{ background:var(--down); color:#fff; }


/* ==========================================================================
   #18 — 2026-08-11: TAB "LỊCH SỬ RỔ" (Index Component History) ở khu #3
   Tab D cạnh Bảng chính/Top 100/Loại trừ. Chọn chỉ số + 2 quý → 2 bảng cạnh
   nhau (Rank | Symbol | % Of Total | Pos Value), ô Symbol tô màu theo trạng
   thái (lên/xuống/thêm/loại/giữ) đúng chuẩn màu trang thầy. Scope #trTaifu.
   Đi kèm index.html #47 + taifu.js #15.
   ========================================================================== */

/* 5 màu chuẩn (đo từ CSS trang thầy) + màu chữ tương phản cho từng nền. */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-lichsu{ margin-top:2px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-dk{ display:flex; align-items:flex-end; gap:8px 10px; flex-wrap:wrap; margin:2px 0 10px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-dk .ls-o{ display:flex; flex-direction:column; gap:3px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-dk label{ font-size:11.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--dim2); font-weight:600; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-sel{ font:inherit; font-size:13.5px; color:var(--txt); background:var(--ink); border:1px solid var(--line);
  border-radius:8px; padding:6px 26px 6px 10px; cursor:pointer; appearance:none; -webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%2364748B'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 8px center; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-sel:focus-visible{ outline:2px solid var(--cool); outline-offset:2px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-sel.ls-chiso{ min-width:210px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-nut{ font:inherit; font-size:13.5px; font-weight:600; padding:7px 16px; border-radius:8px;
  border:1px solid transparent; background:var(--cool); color:#fff; cursor:pointer; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-nut:hover{ filter:brightness(1.06); }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-nut.phu{ background:var(--panel); color:var(--dim); border-color:var(--line); }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-nut.phu:hover{ color:var(--txt); border-color:var(--cool); filter:none; }

/* Chú thích 5 màu */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-legend{ display:flex; flex-wrap:wrap; gap:6px 14px; margin:0 0 12px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-leg{ display:inline-flex; align-items:center; gap:6px; font-size:13px; color:var(--dim); }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-leg .cham{ width:13px; height:13px; border-radius:3px; flex:none; border:1px solid rgba(0,0,0,.08); }

/* Tóm tắt đếm trạng thái (so quý sau với quý trước) */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-tomtat{ font-size:13px; color:var(--dim2); margin:0 0 10px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-tomtat b{ color:var(--txt); font-weight:600; }

/* 2 bảng cạnh nhau; hẹp thì xuống hàng */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-doi{ display:grid; grid-template-columns:1fr 1fr; gap:16px; align-items:start; }
@media (max-width:900px){ :is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-doi{ grid-template-columns:1fr; } }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-cot .ls-tt{ font-size:13.5px; font-weight:700; color:var(--txt); margin:0 0 6px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-cot .ls-tt small{ font-weight:500; color:var(--dim2); }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-bang{ background:var(--panel); border:1px solid var(--line); border-radius:var(--r);
  box-shadow:var(--shadow); overflow:auto; max-height:70vh; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-bang table{ min-width:0; width:100%; border-collapse:collapse; font-size:13px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-bang thead th{ position:sticky; top:0; z-index:2; background:var(--panel);
  text-align:left; font-size:11px; letter-spacing:.05em; text-transform:uppercase; color:var(--dim);
  font-weight:700; padding:8px 9px; border-bottom:1px solid var(--line); white-space:nowrap; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-bang th.c{ text-align:center; } :is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-bang th.r{ text-align:right; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-bang tbody td{ padding:6px 9px; border-bottom:1px solid var(--line-soft); white-space:nowrap; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-bang td.c{ text-align:center; } :is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-bang td.r{ text-align:right; font-variant-numeric:tabular-nums; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-bang tbody tr:last-child td{ border-bottom:0; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-rank{ color:var(--dim2); width:1%; }

/* Ô Symbol tô màu theo trạng thái — màu CHUẨN trang thầy, chữ đủ tương phản.
   Dùng !important nhẹ để không bị theme override nền panel. */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-sym{ font-weight:600; border-radius:4px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-sym small{ display:block; font-size:11px; font-weight:400; opacity:.8; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-1{ background:#A2E4CB !important; color:#0b3b28 !important; }   /* Lên hạng  */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-2{ background:#EA9999 !important; color:#5c1414 !important; }   /* Xuống hạng */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-3{ background:#3CB371 !important; color:#ffffff !important; }   /* Thêm mới  */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-4{ background:#BC3350 !important; color:#ffffff !important; }   /* Bị loại   */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-5{ background:#D9D9D9 !important; color:#1f2937 !important; }   /* Giữ nguyên */

/* Trạng thái rỗng/lỗi + đang tải */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-cho{ padding:20px; font-size:13.5px; color:var(--dim); }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-cho b{ color:var(--txt); }


/* ==========================================================================
   #13 — 2026-08-11: BUMP CHART "Lịch sử thứ hạng" ở khu #4 + thu gọn panel Markup
   Khu #4 (#chart-card) 2 mặt: Markup (thu gọn) ↔ Lịch sử rổ (dải chip + bump chart). (#64: Markup `#chart-card` sang tab
   Dữ liệu thị trường `#trThiTruong`; khu #4 là khung `#lsCard` chỉ có bump. #115 ĐỔI NGƯỢC: khu #4 trang chủ lại là Markup
   `#chart-card`, khung bump `#lsCard` nằm ở mặt `#ttBump` của `#trThiTruong`.)
   Scope #trTaifu. Đi kèm index.html #48 + taifu.js #16.
   ========================================================================== */

/* --- Thu gọn panel số liệu Markup (#mkTren) cho biểu đồ to hơn --- */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .mk-head{ padding:12px 16px 8px; gap:8px 18px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .mk-markup{ font-size:24px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .ruler{ padding:8px 16px 2px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .ruler-head{ margin-bottom:5px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .ruler-bar{ height:24px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .stats{ border-top:1px solid var(--line); }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .stats .stat{ padding:9px 14px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .stats .stat .v{ font-size:16px; margin-top:3px; }
/* Biểu đồ nến Markup to hơn (đã dồn số liệu lên trên) */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #chart-card #chart{ height:500px; }

/* --- Mặt Lịch sử rổ: đầu khu (tiêu đề + nút ghost) --- */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-bump-head{ display:flex; align-items:center; justify-content:space-between;
  gap:10px; flex-wrap:wrap; padding:12px 14px 4px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-bump-tt{ font-size:13.5px; font-weight:700; color:var(--txt); }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-bump-tt span{ color:var(--cool); font-weight:600; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-ghost-lbl{ font-size:12.5px; color:var(--dim2); display:inline-flex;
  align-items:center; gap:5px; cursor:pointer; user-select:none; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-ghost-lbl input{ cursor:pointer; margin:0; }

/* --- Dải chip 30 coin (bật/tắt đường) --- */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-bump-legend{ display:flex; flex-wrap:wrap; gap:4px 5px;
  padding:2px 14px 10px; max-height:104px; overflow:auto; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-chip{ all:unset; cursor:pointer; display:inline-flex; align-items:center; gap:5px;
  font-size:12px; font-weight:600; padding:3px 9px 3px 6px; border-radius:999px;
  border:1px solid var(--line); color:var(--txt); background:var(--panel);
  transition:.12s; white-space:nowrap; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-chip:hover{ border-color:var(--cool); }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-chip .sw{ width:10px; height:10px; border-radius:3px; flex:none; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-chip.tat{ opacity:.38; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-chip.tat .sw{ background:var(--dim2) !important; }

/* --- Container bump chart + tooltip hover --- */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #lsBump{ position:relative; width:100%; height:500px; margin:0 4px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-bump-tip{ position:absolute; z-index:6; pointer-events:none; display:none;
  background:var(--panel); border:1px solid var(--line); border-radius:8px; padding:5px 9px;
  font-size:13px; font-weight:600; color:var(--txt); white-space:nowrap;
  box-shadow:0 4px 14px rgba(0,0,0,.16); }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-bump-tip .sw{ display:inline-block; width:9px; height:9px; border-radius:2px;
  margin-right:6px; vertical-align:baseline; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-bump-tip small{ color:var(--dim2); font-weight:600; margin-left:4px; }

@media (max-width:760px){ :is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #chart-card #chart, :is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #lsBump{ height:380px; } }


/* ==========================================================================
   #14 — 2026-08-11: Đồng bộ size 4 khu + lề biểu đồ #2 + thu gọn 1/3 + nút chuyển Markup/Bump
   Scope #trTaifu. Đi kèm index.html #49 + taifu.js #17.
   ========================================================================== */

/* (2) Đồng bộ CHIỀU CAO vùng hiển thị 4 khu — chuẩn theo Markup (#4) ~500px.
   #2 (biểu đồ chỉ số) do taifu.js doLai() đặt 500/380; ở đây đặt cho bảng #1/#3 + bump. */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac){ --khu-h: 758px; }   /* #16: nâng để BIỂU ĐỒ về ~500px như cũ; bảng #1/#3 kéo dãn theo */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-1 .bang{ max-height:var(--khu-h); overflow:auto; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-1 .tf-bang thead th{ position:sticky; top:0; background:var(--panel); z-index:2; }
#trTaifu .th-3 .bang{ max-height:var(--khu-h); }          /* ghi đè 640 cũ */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #chart-card #chart{ height:var(--khu-h); }        /* Markup */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #lsBump{ height:var(--khu-h); }                   /* bump */
@media (max-width:760px){ :is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac){ --khu-h: 600px; } }
/* (#115) ĐỔI CHỖ NGƯỢC #64: khung Markup `#chart-card` VỀ LẠI khu phải trang chủ (`#trTaifu .th-4`, luật co giãn ở khối (A)
   bên dưới) ⇒ luật `#trThiTruong .tt-markup` và `#trThiTruong #chart-card #chart{500px}` của #64 đã XOÁ (khối bọc không còn). */
/* (#65) GD nhịp ③b — tab con của tab "Dữ liệu thị trường" (#115: Tín hiệu · Top 100 · Lịch sử thứ hạng · Lịch sử rổ · Quản lý coin).
   Nút ăn chung kiểu `.tf-tab3-nut` của khu #3 (đã gộp `#trThiTruong` vào danh sách `:is()` ở #64) — không đẻ kiểu mới.
   Bảng Top 100 nay đứng CẢ BỀ NGANG (trước bó trong khu #3 rộng ~50%) ⇒ cho cao tối đa 70% màn, tự cuộn, đầu bảng dính. */
#trThiTruong .tt-tab{ margin:0 0 16px; }
#trThiTruong #ttBang100Wrap{ max-height:70vh; overflow:auto; }
/* (#65) Đầu bảng dính đã có luật toàn cục `.bang > table > thead > tr > th` (z-index 5) — không đẻ luật trùng.
   Nhưng bề ngang tối thiểu 1040px của bảng Top 100 lại ghim theo `.th-khu` (khu #3 cũ) nên KHÔNG trúng chỗ mới:
   thiếu nó thì ở màn ~1000px 11 cột bị ép vào 720px, chữ tiêu đề gãy dòng thay vì cuộn ngang. */
#trThiTruong #ttBang100Wrap table.tf-b-top100{ min-width:1040px; }
#trThiTruong #ttBang100Head{ margin-bottom:8px; }
#trThiTruong #tfMSigWrap{ margin-bottom:24px; }
/* (#115) Ba mặt mới của tab này (index.html #256), mỗi mặt một khung rộng hết bề ngang — KHÔNG bó max-width, KHÔNG thêm bo góc.
   · Bump (`#ttBump` > `#lsCard`): cao theo màn hình (vừa một màn, trần = --khu-h như khu #4 cũ) thay cho co giãn theo cột `.th-4`.
   · Quản lý coin: ba bảng giữ khung cuộn riêng + đầu bảng dính (trước là 46vh trong khu #3 hẹp; nay 70vh như Top 100 / Lịch sử rổ). */
#trThiTruong #lsBump{ height:clamp(380px, calc(100vh - 330px), var(--khu-h)); }
#trThiTruong #ttBump .tf-sec-tt{ margin:0 0 10px; }
/* (luật `#trThiTruong .qlc-bang{70vh}` nằm ở khối "Quản lý coin" bên dưới, ngay sau dòng `max-height:none` nó phải thắng.) */

/* (3) Biểu đồ chỉ số/danh mục (#2): thêm LỀ TRÁI/PHẢI nhỏ như Markup (bỏ tràn sát viền) */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) :is(#tfChart,.tf-chart-box){ margin:0 10px; width:auto; }

/* (5) Nút thu gọn: chỉ ẩn 2/3 bảng trái, chừa 1/3 (còn thấy cột #/tên ở đầu bảng) */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-tang.thu{ grid-template-columns:1fr 2fr; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-tang.thu > .th-khu:first-child{ min-height:0 !important; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-tang.thu > .th-khu:first-child > .bang{ display:block !important; }   /* giữ bảng hiện, không ẩn hết */
@media (max-width:900px){ :is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-tang.thu{ grid-template-columns:1fr; }
  :is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-tang.thu > .th-khu:first-child > :not(.th-thu){ display:block !important; } }

/* (4) Nút chuyển TAY Markup Rate ↔ Bump chart ở đầu khu #4 */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .khu4-nav{ display:flex; gap:4px; padding:9px 12px 0; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .khu4-tab{ font:inherit; font-size:13px; font-weight:600; padding:6px 13px; border-radius:8px 8px 0 0;
  border:1px solid transparent; border-bottom:none; background:transparent; color:var(--dim); cursor:pointer; transition:.12s; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .khu4-tab:hover{ color:var(--txt); background:var(--line-soft); }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .khu4-tab.chon{ background:var(--panel); border-color:var(--line); color:var(--cool); }


/* ============================================================================
   #15 (đi kèm index #50 + taifu #18) — 4 KHU CAO BẰNG NHAU + THIẾT KẾ LẠI MẶT MARKUP
   Scope #trTaifu, THÊM cuối file (ghi đè rule trên nhờ cascade). KHÔNG sửa chart.js.
   ============================================================================ */

/* ---- (A) 4 khu #1/#2/#3/#4 CAO BẰNG NHAU; thân chính co giãn lấp đầy ----
   Mỗi khu = cột flex, tối thiểu = --khu-h → chưa có dữ liệu vẫn KÉO DÃN khung xuống, không co lại. */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-tang{ align-items:stretch; }                       /* 2 ô cùng hàng cao bằng nhau */
/* CHỈ 4 khu #1-#4 thành cột flex + CHIỀU CAO CỐ ĐỊNH --khu-h (KHÔNG đụng khu #5 phương pháp luận).
   height cố định (không phải min-height): ngắn → chừa trống; DÀI → thân tự cuộn TRONG khung, không phình.
   padding:0 — GỠ 'section{padding:52px 0}' toàn cục (khu là thẻ <section>) để thân LẤP ĐẦY khung,
   không bị 52px trên+dưới ăn mất chỗ. box-sizing:border-box để height gồm cả viền. */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-1, :is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-2, #trTaifu .th-3, #trTaifu .th-4{
  display:flex; flex-direction:column; height:var(--khu-h); padding:0; box-sizing:border-box; }

/* Bảng #1/#3: card chính chiếm hết chỗ còn lại — ngắn thì chừa trống, dài thì tự cuộn */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-1 .bang,
#trTaifu .th-3 .bang{ flex:1; min-height:0; max-height:none; height:auto; overflow:auto; }
/* (#115) luật `#trTaifu .th-3 .tf-lichsu` XOÁ: khu "Lịch sử rổ" sang tab Dữ liệu thị trường (bảng `.ls-bang` tự cuộn 70vh). */

/* Biểu đồ #2: card + #tfChart co giãn lấp đầy (trừ khi phóng to toàn màn hình .tf-full) */
/* (#128) Mở sang khu #4 + lớp chung: thẻ biểu đồ nến từng coin `#coinChartCard` (`.tf-chart-card` trong `.th-4`) co giãn y thẻ biểu đồ trên — MỘT luật cho cả hai. */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) :is(.th-2,.th-4) :is(#tfChartCard,.tf-chart-card):not(.tf-full){ display:flex; flex-direction:column; flex:1; min-height:0; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) :is(.th-2,.th-4) :is(#tfChartCard,.tf-chart-card):not(.tf-full) :is(#tfChart,.tf-chart-box){ flex:1; min-height:0; height:auto; margin:6px 10px 0; width:auto; }
#trTaifu .th-4 .tf-chart-card{ min-width:0; }   /* y `#trTaifu .th-4 #chart-card` bên dưới: thẻ ở cột phải không được nở rộng theo hàng nút */

/* Khu #4: thẻ + biểu đồ co giãn lấp đầy. (#115) ĐỔI CHỖ NGƯỢC #64: khu #4 nay lại là khung Markup `#chart-card` (phần số
   `#mkTren` + hàng nút `#bar` cao theo chữ, biểu đồ `#chart` ăn hết phần còn lại ⇒ thẻ vừa khít --khu-h cùng bảng bên trái,
   không tràn). Có công cụ vẽ thì `#chart` nằm trong `.cv-wrap` (congcuve.js tự co giãn), `height:auto` để nó kéo dãn theo.
   Hai luật `#trTaifu .th-4 #lsCard…` của #64 XOÁ — bump sang `#trThiTruong` (cao theo luật `#trThiTruong #lsBump` ở trên). */
#trTaifu .th-4 #usdtSectionTitle{ padding-left:42px; }   /* chừa chỗ cho nút thu gọn › (góc trái-trên khu phải) khỏi đè lên chữ */
#trTaifu .th-4 #chart-card{ display:flex; flex-direction:column; flex:1; min-height:0; min-width:0; }
#trTaifu .th-4 #chart-card #chart{ flex:1; min-height:0; height:auto; }
@media (max-width:900px){ #trTaifu .th-4 #usdtSectionTitle{ padding-left:0; } }   /* màn hẹp nút › đã ẩn ⇒ không cần chừa chỗ */
/* Màn điện thoại (≤760px): --khu-h còn 600px, phần số + hàng nút rớt dòng ăn gần hết ⇒ nến chỉ còn ~290px. Cho khu phải cao theo
   nội dung, biểu đồ cao cố định 380px (bằng mức cũ của nó ở màn hẹp). Hai khu lúc này đã xếp dọc nên không cần cao bằng nhau. */
@media (max-width:760px){
  #trTaifu .th-4{ height:auto; }
  #trTaifu .th-4 #chart-card{ flex:none; }
  #trTaifu .th-4 #chart-card #chart{ flex:none; height:380px; }
  /* (#128) thẻ biểu đồ coin ở màn hẹp: cùng cách với thẻ USDT ngay trên (cao theo nội dung, biểu đồ 380px). Cùng độ nặng với luật co giãn chung ⇒ đứng SAU nó mới thắng. */
  :is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-4 :is(#tfChartCard,.tf-chart-card):not(.tf-full){ flex:none; }
  :is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-4 :is(#tfChartCard,.tf-chart-card):not(.tf-full) :is(#tfChart,.tf-chart-box){ flex:none; height:380px; }
}
/* (#128) KHU #4 HAI MẶT — "Biểu đồ coin" | "USDT Markup Rate". Cờ `data-market-face` nằm ở dòng tiêu đề `#usdtSectionTitle` (taifu.js `setMarketFace` đổi);
   thẻ KHÔNG thuộc mặt đang hiện bị giấu bằng bộ chọn anh em `~`. Không dùng thuộc tính `hidden` trên thẻ: luật `display:flex` của hai thẻ thắng `[hidden]`,
   và thẻ mở `#chart-card` phải giữ nguyên từng chữ (chart.js + các bài kiểm cũ bám). `!important` để thắng cả `.cv-on.cv-full{display:flex!important}` của congcuve. */
#trTaifu .th-4 #usdtSectionTitle[data-market-face="coin"] ~ #chart-card{ display:none !important; }
#trTaifu .th-4 #usdtSectionTitle[data-market-face="usdt"] ~ #coinChartCard{ display:none !important; }
/* (01/11/2026) MẶT THỨ BA "BTC Dominance" (`#btcdCard`, chiso/btcDominance): luật MỚI, hai luật trên giữ nguyên. Mặt btcd ⇒ giấu thẻ coin + thẻ USDT;
   mặt khác ⇒ giấu thẻ BTC Dominance. Thẻ dùng lớp chung `.tf-chart-card` nên co giãn / màn hẹp ăn sẵn luật của thẻ nến coin. */
#trTaifu .th-4 #usdtSectionTitle[data-market-face="btcd"] ~ :is(#chart-card,#coinChartCard){ display:none !important; }
#trTaifu .th-4 #usdtSectionTitle:not([data-market-face="btcd"]) ~ #btcdCard{ display:none !important; }
#btcdCard{ border-radius:0; }
#btcdCard .cv-top > .cv-note:empty{ flex:0 0 0; }
/* (02/11/2026 anh) thẻ BTC Dominance KHÔNG có chữ đứng đầu hàng (khác thẻ coin "BTC" / thẻ USDT giá P2P) ⇒ kiểu rớt dòng `justify-content:flex-end`
   dồn cả cụm 1D · Chỉ báo sang phải. Ô đệm giãn ra ⇒ cụm trái đứng trái, cụm ? · phóng to · ↻ đứng phải như hai thẻ kia. */
#btcdCard .cv-head.cv-head-wrap .cv-top > .cv-spacer{ flex:1 1 0%; }
#btcdCard #btcdChart{ position:relative; }
/* chú giải hai chỉ báo đè góc trái trên biểu đồ (mockup-btcd-v3) */
#btcdCard .btcd-legend{ position:absolute; left:6px; top:4px; z-index:3; font-size:12px; line-height:1.75; pointer-events:none; }
#btcdCard .btcd-legend > div{ background:color-mix(in srgb, var(--panel) 85%, transparent); padding:0 6px; width:max-content; max-width:100%; white-space:nowrap; }
#btcdCard .btcd-legend .btcd-legend-name{ font-weight:700; margin-right:4px; }
#btcdCard .btcd-legend .btcd-legend-date{ color:var(--dim2); }
#btcdCard .btcd-legend .btcd-note{ color:var(--dim2); white-space:normal; }
/* Tên coin đang xem — đứng đầu hàng nút, chỗ ô chọn nguồn của biểu đồ trên. */
#trTaifu .th-4 .coin-chart-name{ flex:none; font-size:13.5px; font-weight:700; color:var(--txt); padding-right:4px; white-space:nowrap; }
/* Hàng coin ở bảng thành phần bấm được ⇒ đổi coin của biểu đồ; hàng đang chọn nền vàng mờ + vạch vàng mép trái (mẫu anh duyệt 10/10). */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #tfBang2 tbody tr.coin-row{ cursor:pointer; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #tfBang2 tbody tr.coin-row:hover td{ background:rgba(127,127,127,.08); }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #tfBang2 tbody tr.coin-row.is-selected td{ background:rgba(240,185,11,.16); }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #tfBang2 tbody tr.coin-row.is-selected td:first-child{ box-shadow:inset 3px 0 0 var(--gold,#f0b90b); }

/* ---- (B) Mặt Markup (khu #4 cũ — #64: nay ở tab Dữ liệu thị trường): TÁCH panel số liệu ↔ biểu đồ nến; BỎ thước phân vị; số liệu HÀNG NGANG ---- */
/* Ẩn thước phân vị — GIỮ #rulerBar/#hist trong DOM (chart.js veThuoc đọc mỗi resize) nên chỉ display:none */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #chart-card #ruler{ display:none; }

/* Panel số liệu = 1 khối riêng, có đường ngăn với biểu đồ nến bên dưới (2 phần rõ ràng) */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren{ border-bottom:1px solid var(--line); padding-bottom:2px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .mk-head{ padding:10px 16px 6px; }

/* Ngày giờ cập nhật: 1 DÒNG NHỎ mờ, không viền (đã dời lên đây) */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .src{ padding:0 16px 6px; border-top:none; font-size:12px; color:var(--dim2); line-height:1.4; }

/* 4 ô thống kê xếp HÀNG NGANG trên 1 HÀNG, KHÔNG bao giờ xuống dòng (kể cả mobile) */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .stats{ display:flex; flex-wrap:nowrap; gap:0; border-top:1px solid var(--line-soft); }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .stats .stat{ flex:1 1 0; min-width:0; padding:7px 10px; background:transparent; border-left:1px solid var(--line-soft); }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .stats .stat:first-child{ border-left:none; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .stats .stat .k{ font-size:9px; letter-spacing:.04em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .stats .stat .v{ font-size:14px; margin-top:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
@media (max-width:760px){
  :is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .stats .stat{ padding:6px 7px; }
  :is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .stats .stat .k{ font-size:8px; }
  :is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .stats .stat .v{ font-size:13px; }
}

/* ---- (B tiếp) GỌN panel số liệu Markup để BIỂU ĐỒ NẾN là trọng tâm (cao hơn panel) ---- */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #lsCard .khu4-nav{ padding:6px 12px 0; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .mk-head{ padding:8px 14px 4px; gap:2px 16px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .mk-head .title{ font-size:13.5px; line-height:1.25; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .mk-head .title span{ font-size:11.5px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .mk-markup{ font-size:20px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .mk-head-right{ gap:2px 12px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .mk-rate-lab{ font-size:12px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .mk-rate-val{ font-size:13.5px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .mk-rate-chg{ font-size:12px; min-width:60px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .src{ padding:1px 14px 3px; font-size:11.5px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .stats .stat{ padding:5px 12px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .stats .stat .k{ font-size:9px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .stats .stat .v{ font-size:14px; margin-top:1px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #chart-card .bar{ padding:6px 14px; gap:6px 10px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #chart-card .bar .ohlc{ font-size:12px; }
/* #23: nút "TaiFu 30 Index" đứng cùng hàng với 1H/1D/1W — nới đệm cho cao bằng
   nhóm .tf (nút .tf-leg gốc ở khu #2 thấp hơn vì nằm dưới chân biểu đồ). */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #chart-card .bar .tf-leg{ padding:8px 12px; font-size:13px; font-weight:600; }
/* #23: Lightweight Charts bố trí bên trong bằng 1 thẻ <table> — thẻ đó ĂN luôn rule
   `table{ min-width:900px }` ở dòng ~506 (dành cho bảng dữ liệu). Bình thường phần dư
   dồn hết vào ô cuối nên không ai thấy; nhưng khi biểu đồ markup bật thêm TRỤC TRÁI
   (đường TaiFu 30), trình duyệt chia phần dư sang ô trục trái → vùng vẽ + trục phải bị
   đẩy văng khỏi khung. Trả min-width về 0 cho bảng NỘI BỘ của mọi biểu đồ. */
.tv-lightweight-charts table{ min-width:0; }

/* ============================================================================
   #17 (đi kèm index #52) — PANEL SỐ LIỆU MARKUP dựng lại theo mẫu người dùng.
   1 khu, nền trắng (var(--panel)), KHÔNG kẻ ô. Trái 3 dòng · GIỮA markup% to nhất · PHẢI 2 dòng tỷ giá.
   ============================================================================ */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren{ border-bottom:none; padding:0 0 4px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .mk-top{ display:flex; align-items:center; gap:12px; padding:11px 14px 5px; }
/* TRÁI: tên (đậm) + cập nhật (mờ) */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .mk-left{ display:flex; flex-direction:column; gap:1px; flex:0 1 auto; min-width:0; max-width:44%; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .mk-title{ font-size:15px; font-weight:700; line-height:1.15; letter-spacing:-.01em; white-space:nowrap; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .mk-left .src{ padding:0; border:none; margin:0; background:transparent; border-radius:0; font-size:9.5px; color:var(--dim2); line-height:1.25; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
/* GIỮA: giá trị chỉ số — TO NHẤT (màu do chart.js đặt: âm=đỏ, dương=xanh) */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .mk-markup{ font-size:27px; font-weight:700; line-height:1; white-space:nowrap; flex:0 0 auto; text-align:center; }
/* PHẢI: 2 dòng tỷ giá — nhãn | giá | thay đổi(±%) */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .mk-right{ display:flex; flex-direction:column; gap:4px; flex:0 0 auto; margin-left:auto; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .mk-rate-row{ display:flex; align-items:baseline; gap:6px; justify-content:flex-end; white-space:nowrap; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .mk-rate-lab{ color:var(--dim); font-size:12px; font-weight:500; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .mk-rate-val{ font-weight:600; font-size:13px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .mk-rate-chg{ font-size:11.5px; min-width:52px; text-align:right; }
/* DÒNG 3: 3 chỉ số inline "nhãn: giá trị", KHÔNG kẻ ô; ẩn ô "Số phiên" (đã có ở dòng Cập nhật) */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .stats{ display:flex; flex-wrap:wrap; gap:2px 16px; border:none; background:transparent; padding:2px 14px 8px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .stats .stat{ display:inline-flex; align-items:baseline; gap:5px; flex:0 0 auto; min-width:0; margin:0; padding:0; background:none; border:none; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .stats .stat .k{ font-size:13px; font-weight:400; color:var(--dim); letter-spacing:0; text-transform:none; white-space:nowrap; overflow:visible; text-overflow:clip; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .stats .stat .k::after{ content:":"; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .stats .stat .v{ font-size:13px; font-weight:600; margin:0; white-space:nowrap; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #mkTren .stats .stat:nth-child(4){ display:none; }   /* Số phiên — ẩn */


/* ==========================================================================
   #19 — 2026-08-15: TAB "QUẢN LÝ COIN" (khu #3, tab E) — đi kèm taifu.js #39 + index #74.
   Bảng điều khiển canh gác coin: 3 hộp thu/phóng + lọc + sắp xếp.
   Scope #trTaifu. CHỈ dùng token màu có sẵn (--up/--down/--gold/--cool/--dim…),
   KHÔNG thêm màu mới. Bảng dùng lại .ls-bang của tab Lịch sử rổ.
   ========================================================================== */

:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-qlc{ margin-top:2px; }
/* (#115) luật `#trTaifu .th-3 .tf-qlc` XOÁ: khu "Quản lý coin" sang tab Dữ liệu thị trường, trang tự cuộn. */

/* #24 — Toàn màn hình nay áp cho CẢ KHU #3 (`.th-3.tf-full`), xem khối riêng ở cuối file.
   Luật `#tfQlCoin.tf-full` cũ đã gỡ: từ taifu.js #48 không còn ai gắn lớp đó lên #tfQlCoin nữa,
   để lại chỉ thành CSS chết đánh lừa người đọc sau. */

/* --- Dòng đầu: tóm tắt + nút toàn màn hình --- */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-dau{ display:flex; align-items:flex-start; justify-content:space-between; gap:10px 16px; flex-wrap:wrap; margin:2px 0 12px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-tomtat{ font-size:13px; color:var(--dim2); line-height:1.7; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-tomtat b{ color:var(--txt); font-weight:600; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-n1{ color:var(--cool) !important; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-n2{ color:var(--gold) !important; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-n3{ color:var(--down) !important; }

/* --- Hộp ①②③ thu/phóng --- */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-hop{ background:var(--panel); border:1px solid var(--line); border-radius:var(--r);
  box-shadow:var(--shadow); margin:0 0 12px; padding:0; overflow:hidden; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-hop-dau{ display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:11px 14px; border-bottom:1px solid var(--line-soft); background:var(--line-soft); }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-hop.thu .qlc-hop-dau{ border-bottom:0; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-hop-dau h3{ margin:0; font-size:13.5px; font-weight:700; color:var(--txt); }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-thu{ font:inherit; font-size:13px; line-height:1; cursor:pointer; flex:none;
  width:26px; height:26px; border-radius:7px; border:1px solid var(--line);
  background:var(--panel); color:var(--dim); transition:.15s; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-thu:hover{ color:var(--txt); border-color:var(--cool); }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-hop-than{ padding:12px 14px 14px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-hop.thu .qlc-hop-than{ display:none; }

/* --- Hàng điều khiển bảng ② --- */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-dk{ display:flex; align-items:center; gap:8px 10px; flex-wrap:wrap; margin:0 0 11px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-tim{ min-width:230px; flex:1 1 230px; max-width:340px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-sel{ min-width:150px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-themtay{ margin-left:auto; }

/* --- Bảng (kế thừa .ls-bang) --- */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-bang{ max-height:none; }
/* (#115) luật `#trTaifu .th-3 .qlc-bang` (46vh) ĐỔI CHA → `#trThiTruong .qlc-bang` (70vh) (đặt cạnh khối tab Dữ liệu thị trường phía trên —
   ⚠️ luật đó đứng TRƯỚC dòng `max-height:none` ngay trên nên phải nhắc lại ở đây cho thắng thứ tự). */
#trThiTruong .qlc-bang{ max-height:70vh; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-bang th.sx{ cursor:pointer; user-select:none; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-bang th.sx:hover{ color:var(--cool); }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-sym{ font-weight:600; color:var(--txt); }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-sym small{ display:block; font-size:11px; font-weight:400; color:var(--dim2); }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-bang tr.qlc-ngung td{ opacity:.5; }
/* Ô MarketCap cuối: dòng trên giá trị, dòng dưới mốc ngày (nhỏ, mờ hơn) */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-bang td.r small{ display:block; font-size:11px; font-weight:400; line-height:1.5; }
/* Cột số thứ tự — dùng lại .ls-rank của tab Lịch sử rổ */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-bang td.ls-rank, :is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-bang th.ls-rank{ text-align:right; padding-right:4px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-canh{ color:var(--down); font-weight:600; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-ok{ color:var(--up); }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-tre{ color:var(--gold); }

/* --- Nhãn tình trạng (viền + chữ theo token, không tô nền đặc) --- */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-badge{ display:inline-block; font-size:12px; font-weight:600; padding:2px 8px;
  border-radius:999px; border:1px solid currentColor; white-space:nowrap; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-b-du{ color:var(--up); }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-b-mc{ color:var(--gold); }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-b-tre{ color:var(--gold); }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-b-rot{ color:var(--down); }

/* --- Nút thao tác --- */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-nut{ font:inherit; font-size:12.5px; font-weight:600; cursor:pointer;
  padding:5px 11px; border-radius:7px; border:1px solid var(--line);
  background:var(--panel); color:var(--dim); transition:.15s; margin-right:6px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-nut:hover{ filter:brightness(1.04); }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-nut.them{ background:var(--up); border-color:var(--up); color:#fff; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-nut.bo:hover{ color:var(--txt); border-color:var(--cool); }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-go{ font:inherit; font-size:13.5px; line-height:1; cursor:pointer;
  width:26px; height:26px; border-radius:7px; border:1px solid var(--line);
  background:var(--panel); color:var(--dim); transition:.15s; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-go:hover{ color:var(--down); border-color:var(--down); }

/* --- Chú thích cuối bảng ② --- */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-chuthich{ font-size:12.5px; color:var(--dim2); margin-top:9px; line-height:1.65; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-chuthich b{ color:var(--txt); font-weight:600; }

/* --- Chip loại trong nhật ký --- */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-loai{ display:inline-block; font-size:11.5px; font-weight:600; color:var(--dim);
  background:var(--line-soft); border-radius:5px; padding:2px 7px; white-space:nowrap; }

@media (max-width:760px){
  :is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-tim, :is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-sel{ min-width:0; width:100%; max-width:none; flex:1 1 100%; }
  :is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-themtay{ margin-left:0; }
}

/* ==========================================================================
   #20 — 2026-08-15: NÚT THU GỌN CHIỀU NGƯỢC LẠI (.th-thu-p / .th-tang.thu-p)
   Trước chỉ thu được khu TRÁI để phóng to phải. Nay thêm nút ở góc TRÁI-TRÊN của
   khu PHẢI để thu phải → phóng to bảng bên trái. Dùng lại toàn bộ style .th-thu,
   chỉ đổi vị trí + chiều mũi tên. Đi kèm index #74 (nối dây trong script inline).
   ========================================================================== */

/* Nút nằm góc TRÁI-TRÊN của khu phải (nút cũ ở góc PHẢI-TRÊN của khu trái) */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-thu-p{ left:8px; right:auto; }

/* Thu khu PHẢI: bảng trái nở ra 2/3 — đối xứng với .thu (1fr 2fr) */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-tang.thu-p{ grid-template-columns:2fr 1fr; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-tang.thu-p > .th-khu:last-child .th-thu-p{ transform:rotate(180deg); left:7px; }

/* mobile: về 1 cột, ẩn nút (giống .thu) */
@media (max-width:900px){
  :is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-tang.thu-p{ grid-template-columns:1fr; }
  :is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-thu-p{ display:none; }
}

/* ============================================================
   #21 (GĐ3 CKV30) — 2 dòng chỉ số CKV30 ở khu #1 + tab "Top 100" ĐÃ GỘP
   (Trạng thái / Lý do / nút Chặn–Bỏ chặn / tiêu đề cột sắp xếp được).
   ============================================================ */

/* Dòng chỉ số CKV30 trong bảng khu #1 — nhấn nhẹ để tách khỏi 6 chỉ số cũ. */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-bang tr.tf-ckv td{ background:var(--cool-soft); }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-bang tr.tf-ckv .tf-ten b{ color:var(--cool); }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-bang tr.tf-ckv.chon td{ background:var(--cool-soft); box-shadow:inset 2px 0 0 var(--cool); }

/* Tiêu đề cột bấm được để sắp xếp. Cột đang sắp xếp: đậm + màu nhấn. */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-bang th.tf-sx{ cursor:pointer; user-select:none; white-space:nowrap; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-bang th.tf-sx:hover{ color:var(--cool); }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-bang th.tf-sx.dang{ color:var(--cool); font-weight:700; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-sx-mo{ opacity:.28; font-size:9px; letter-spacing:-1px; }

/* Viên trạng thái: Trong rổ (xanh) · Đã chặn (đỏ) · nhóm loại tự động (xám trung tính).
   ⚠️ TÊN CLASS PHẢI LÀ .tf-tthai, KHÔNG được rút thành .tf-tt: .tf-tt đã có từ trước, gắn trên
   thẻ <tr> của 3 dòng chỉ số TÁI TẠO ở khu #1. Bản #21 lỡ đặt trùng → rule display:inline-block
   rơi trúng <tr> làm 3 dòng đó văng khỏi bảng, khu #1 vỡ hàng (xem #22). */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-tthai{ display:inline-block; font-size:12px; line-height:1; padding:4px 8px; border-radius:999px; white-space:nowrap; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-tthai.ro{ background:rgba(22,163,74,.12); color:var(--up); }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-tthai.chan{ background:rgba(220,38,38,.12); color:var(--down); }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-tthai.auto{ background:var(--line-soft); color:var(--dim); }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-ly{ font-size:13px; color:var(--dim); max-width:220px; }

/* Bảng gộp có 11 cột (thêm Trạng thái + Lý do) → nới bề ngang tối thiểu, cho cuộn ngang
   thay vì bóp chữ. Ghi ĐÈ rule min-width:560px của bản Top 100 cũ (9 cột) ở trên. */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-khu .tf-bang table.tf-b-top100{ min-width:1040px; }

/* ==========================================================================
   #24 — TOÀN MÀN HÌNH CHO CẢ KHU #3  (nút #khu3Full ở hàng tab, index.html #78)
   Trước đây chỉ panel "Quản lý coin" bung được, và nút nằm lọt trong panel đó. Nay lớp
   .tf-full gắn lên chính <section class="th-khu th-3"> ⇒ áp cho cả khu
   (#115: khu #3 nay chỉ còn bảng thành phần — Top 100 · Lịch sử rổ · Quản lý coin đã sang tab Dữ liệu thị trường).
   DÙNG LẠI đúng bộ thuộc tính của #tfChartCard.tf-full, không đẻ cơ chế mới.
   ========================================================================== */
#trTaifu .th-3.tf-full{
  position:fixed; inset:16px; z-index:60; margin:0; max-width:none;
  background:var(--ink); border-radius:var(--r); padding:16px 18px;
  box-shadow:0 20px 60px rgba(0,0,0,.35); overflow:auto;
}
/* Gỡ MỌI trần chiều cao + cuộn lồng bên trong, để nội dung dùng trọn khung vừa bung ra.
   Thiếu 3 dòng này thì bấm toàn màn hình xong bảng vẫn kẹt trong khung 640px/46vh cũ,
   tức nút bấm như không có tác dụng. */
#trTaifu .th-3.tf-full .bang{ max-height:none; }
/* (#115) hai luật `#trTaifu .th-3.tf-full .qlc-bang` / `.tf-qlc` XOÁ: khu #3 không còn mặt Quản lý coin. */
/* Đang chiếm trọn màn hình thì nút "thu khu trái để phóng to khu phải" vô nghĩa (khu phải
   đang bị che) → ẩn đi cho khỏi bấm nhầm. */
#trTaifu .th-3.tf-full .th-thu{ display:none; }
/* Nút toàn màn hình: đẩy về cuối hàng tab, tách khỏi cụm nút chuyển tab. */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .khu3-full{ margin-left:auto; }
@media (max-width:900px){ :is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .khu3-full{ margin-left:0; } }


/* ==========================================================================
   TAB CHẨN ĐOÁN (Khu 3, K-14 GĐ2) — TẤT CẢ scope bằng #trChanDoan
   Cùng lý do như khối #trTaifu ở trên: class không scope thì rò sang tab khác
   và vỡ âm thầm, không báo lỗi gì. Tiền tố `cd-` đã grep, chưa ai dùng.
   ========================================================================== */
/* GĐ2b điểm ⑨ + anh chốt 31/08 (soi nhịp đầu): bỏ khoá 1120px — khu Chẩn đoán
   trải hết vùng nội dung, cùng khuôn 2 tiền lệ #trGiaodich .wrap / #trTaifu .wrap. */
#trChanDoan .wrap{max-width:none}
#trChanDoan .cd-thanh{display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin:16px 0 6px}
#trChanDoan .cd-thanh .dmbar{margin:0}
/* ĐÃ GỠ 03/09/2026: `.cd-che` (công tắc Giống web thầy / Chuẩn thiết kế) và
   `.cd-sapco` (nhãn "sắp có"). Anh chốt bỏ hẳn chế độ [CHUẨN] — xem
   File-MD/PHUONG_PHAP_LUAN_TAB_CHANDOAN_V1.md §13. Hai lớp này nay KHÔNG còn phần tử
   nào dùng; grep `cd-che`/`cd-sapco` trước khi dựng lại. */

/* Báo lỗi — guard thiếu trường (H-27). Mặc định ẩn; hiện là ĐỎ, không im lặng. */
#trChanDoan .cd-loi{display:none; margin:10px 0; padding:11px 13px; border-radius:var(--r);
  background:var(--loi-bg); border:1px solid var(--down); color:var(--down); font-size:13.5px}
#trChanDoan .cd-loi.hien{display:block}
#trChanDoan .cd-loi-ct{margin-top:5px; font-size:13px; color:var(--dim); font-weight:400}
#trChanDoan .cd-dangtai{display:none; margin:10px 0; color:var(--dim2); font-size:13.5px}
#trChanDoan .cd-dangtai.hien{display:block}

#trChanDoan .cd-muc-tt{font-size:13.5px; font-weight:700; letter-spacing:.02em; color:var(--txt);
  margin:18px 0 10px}
/* GĐ3: dấu (?) nay là <button> BẤM ĐƯỢC (mở hộp GHICHU_CD) — theo tiền lệ
   data-tfhoi (taifu) / data-hoi (portfolio) đều dùng button để Tab/Enter tới
   được (`soat-loi` 31/08: span không focus được là lệch cả 2 tiền lệ).
   Reset nền/padding/font vì button mang style mặc định của trình duyệt. */
#trChanDoan .cd-hoi{display:inline-flex; align-items:center; justify-content:center; width:15px;
  height:15px; border-radius:50%; border:1px solid var(--line); color:var(--dim2);
  background:none; padding:0; font-family:var(--font); line-height:1;
  font-size:11px; font-weight:600; cursor:pointer; vertical-align:middle}
#trChanDoan .cd-hoi:hover{background:var(--line-soft); color:var(--txt)}
#trChanDoan .cd-goc{position:absolute; top:10px; right:12px}

/* Hàng 3 thẻ. Thẻ trái rộng hơn vì ôm cả khối số lẫn cột chồng. */
#trChanDoan .cd-hang3{display:grid; grid-template-columns:1.06fr 1fr 1fr; gap:14px}
@media (max-width:1000px){ #trChanDoan .cd-hang3{grid-template-columns:1fr} }
#trChanDoan .cd-the{position:relative; background:var(--panel); border:1px solid var(--line);
  border-radius:var(--r); box-shadow:var(--shadow); padding:16px 18px; min-height:196px}
#trChanDoan .cd-the-trong{display:flex; gap:14px; align-items:stretch; height:100%}
#trChanDoan .cd-the-trong.cd-canh{align-items:center}
#trChanDoan .cd-so-khoi{flex:1; min-width:0}

#trChanDoan .cd-so-lon{font-size:26px; font-weight:700; color:var(--txt); letter-spacing:-.01em}
#trChanDoan .cd-so-nhan{font-size:12.5px; color:var(--dim2); margin-top:1px}
#trChanDoan .cd-24h{font-size:13px; margin-top:5px; color:var(--dim)}

/* Băng chuyền quán quân: 2 trang, mũi tên hai bên, chấm chỉ trang bên dưới. */
#trChanDoan .cd-qq-hop{display:flex; align-items:center; gap:4px; margin-top:12px;
  border-top:1px solid var(--line-soft); padding-top:10px}
#trChanDoan .cd-qq{flex:1; min-width:0; text-align:center}
#trChanDoan .cd-qq-dong{margin:3px 0}
#trChanDoan .cd-qq-dong b{display:block; font-size:14px; font-weight:700}
#trChanDoan .cd-qq-dong span{display:block; font-size:11.5px; color:var(--dim2)}
#trChanDoan .cd-qq-dong.cd-mo b{color:var(--dim2); font-weight:500}
#trChanDoan .cd-qq-nut{border:0; background:none; color:var(--dim2); cursor:pointer;
  font-size:17px; line-height:1; padding:2px 5px; border-radius:6px}
#trChanDoan .cd-qq-nut:hover{background:var(--line-soft); color:var(--txt)}
#trChanDoan .cd-cham-hop{display:flex; justify-content:center; gap:5px; margin-top:5px}
#trChanDoan .cd-cham{width:5px; height:5px; border-radius:50%; background:var(--line)}
#trChanDoan .cd-cham.dang{background:var(--cool)}
/* Điểm ⑩ GĐ2b: nowrap ép nhãn "Giá vốn (lũy kế): $…" nằm trọn MỘT dòng. */
#trChanDoan .cd-giavon{margin-top:10px; padding-top:9px; border-top:1px solid var(--line-soft);
  font-size:12.5px; color:var(--dim); text-align:center; white-space:nowrap}

/* Canvas: kích thước do CSS quyết, JS đọc lại bằng getBoundingClientRect rồi
   nhân devicePixelRatio. Đặt kích thước trong JS là hỏng trên màn retina. */
#trChanDoan .cd-cv{display:block}
#trChanDoan .cd-cv-cot{width:118px; height:168px; flex:0 0 auto; align-self:center}
/* Điểm ③ GĐ2b: donut nở ra để chứa dây kéo tên coin quanh vòng (legend phải GIỮ).
   `flex:1 1 auto` + min/max: cửa sổ hẹp thì donut CO chứ không bóp chết legend —
   200px cứng từng đẩy legend về 4,9px ở cửa sổ 1100px (`soat-loi` đo 31/08). */
#trChanDoan .cd-cv-donut{width:100%; max-width:200px; min-width:120px; height:150px; flex:1 1 auto}
/* (#108) BÁNH VÒNG CHẨN ĐOÁN DÙNG CHUNG KIỂU TAB GIAO DỊCH (anh chốt 04/10/2026): ô `#cdDonut` nay là <div> chứa SVG do
   `CKV_VE.veDonut` (portfolio.js) vẽ — các lớp `.donut-*` ở khối hero tab Giao dịch lo ngoại hình. Ở đây chỉ cho hình CO theo
   bề ngang thẻ (thẻ này hẹp hơn hộp 508px của tab Giao dịch): SVG rộng 100% ô vẽ, cao tự theo viewBox. Luật `.cd-cv-donut`
   ở trên hết người dùng (canvas đã gỡ) — để lại vì không hại. */
#trChanDoan .cd-donut-hop{flex:1 1 auto; min-width:0}
/* Thẻ hẹp (cửa sổ ~1000–1300px): hình KHÔNG co dưới 240px (chữ quanh vòng co theo SVG, nhỏ hơn nữa là khó đọc — `soat-loi` đo
   04/10: 1100px chữ chỉ còn ~6px) ⇒ thiếu chỗ thì chú giải RỚT XUỐNG DƯỚI hình (flex-wrap). */
#trChanDoan .cd-donut-hop .donut-body{flex-wrap:wrap; justify-content:center}
/* (#111) Đo thật trang V241 ở cửa sổ 1536px: chỗ trong thẻ 437px mà bản #108 đòi 330 (bánh) + 10 (khe) + 118 (chú giải) = 458 ⇒ chú giải
   rớt xuống dưới, hàng 3 thẻ cao 557px. Trình duyệt quyết định rớt dòng theo CỠ GỐC trước khi tính co ⇒ cỡ gốc bánh đặt 240 (nở tới 330),
   chú giải cỡ gốc 118 ⇒ chỉ rớt khi chỗ trong thẻ < 368px (cửa sổ dưới ~1300px). Chỗ dư chia 4 phần bánh : 1 phần chú giải; bánh chạm
   330px thì phần còn lại về hết chú giải (mã dài không bị cắt "…"); lúc rớt xuống dưới thì chú giải trải hết bề ngang thẻ. */
#trChanDoan .cd-donut-hop .donut-ve{flex:4 1 240px; max-width:330px; min-width:min(240px,100%)}
#trChanDoan .cd-donut-hop .donut-leg{flex:1 0 118px}   /* chú giải giữ đủ chỗ cho "USDT: 36,47 %"; thiếu chỗ thì rớt dòng, không bóp chữ */
/* (#111) RIÊNG thẻ bánh vòng (thẻ chứa `#cdNhanDem`, dòng đếm "N coin & M stablecoin/USD"; 3 thẻ tròn bên dưới KHÔNG đụng): `.cd-the-trong` cao 100% thẻ đẩy dòng đếm lòi ra ngoài mép dưới ⇒ thẻ xếp cột,
   khối bánh ăn phần còn lại, dòng đếm nằm trong thẻ. */
#trChanDoan .cd-the:has(> #cdNhanDem){display:flex; flex-direction:column}
#trChanDoan .cd-the:has(> #cdNhanDem) > .cd-the-trong{flex:1 1 auto; height:auto}
/* ≤560px `.donut-body` đổi sang cột dọc ⇒ flex-basis của bánh thành CHIỀU CAO (để lại khoảng trống dưới hình) ⇒ đặt lại. */
@media (max-width:560px){
  #trChanDoan .cd-donut-hop .donut-ve{flex:none; width:100%; max-width:330px; min-width:0}
  #trChanDoan .cd-donut-hop .donut-leg{flex:none; width:100%}
}
#trChanDoan .cd-donut-hop .donut-svg{width:100%; height:auto}
#trChanDoan .cd-donut-trong{padding:40px 8px; text-align:center; font-size:13px; color:var(--dim2)}
/* Điểm ② GĐ2b: gauge nở ra cho thang số 0-11 quanh vành. */
#trChanDoan .cd-cv-gauge{width:190px; height:122px; flex:0 0 auto}

#trChanDoan .cd-chugiai{flex:1; min-width:0; font-size:12.5px; line-height:1.75}
/* Lịch sử `.cd-cg-o` khu pie: bản đầu nhịp 2a ẩn ô vuông + tô màu lát lên chữ ⇒
   dòng "Hoà" tàng hình (tương phản 1,23:1) — đã quay về ô vuông màu. Từ #37
   (GĐ2b điểm ①) hộp chú giải pie RỜI HẲN DOM, nhãn thành dây kéo trên canvas —
   `.cd-cg-o`/`.cd-chugiai` nay CHỈ còn phục vụ DONUT (bên đó legend vẫn sống).
   Bài học 1,23:1 vẫn nguyên giá trị cho mọi chữ vẽ trên canvas: màu NỀN LÁT
   không bao giờ được đem tô lên CHỮ. */
#trChanDoan .cd-cg-dong{white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
#trChanDoan .cd-cg-o{display:inline-block; width:8px; height:8px; border-radius:2px;
  margin-right:6px; vertical-align:middle}
#trChanDoan .cd-cg-dong b{font-weight:600; color:var(--txt)}
#trChanDoan .cd-cg-dong span{color:var(--dim)}
#trChanDoan .cd-cg-dong.cd-mo{color:var(--dim2)}
#trChanDoan .cd-nhan-duoi{text-align:center; font-size:13px; font-weight:600; color:var(--txt);
  margin-top:10px}
#trChanDoan .cd-gauge-nhan{flex:1; font-size:13.5px; color:var(--txt)}

/* Khu 3 biểu đồ tròn (nhịp 2a). Bộ chuyển này canh TRÁI ở hàng riêng.
   (Ghi chú lịch sử: trước 03/09/2026 còn một bộ nút `.cd-che` trên thanh đầu tab mang
   `margin-left:auto`; class riêng sinh ra để không bị đẩy sang phải. Bộ đó đã gỡ.) */
#trChanDoan .cd-tab{display:inline-flex; border:1px solid var(--line); border-radius:9px;
  overflow:hidden; margin:18px 0 10px}
#trChanDoan .cd-tab button{border:0; background:var(--panel); color:var(--dim); cursor:pointer;
  font:500 13px var(--font); padding:6px 14px}
#trChanDoan .cd-tab button + button{border-left:1px solid var(--line)}
/* Nút đang chọn: nền nhạt + chữ đậm, KHÔNG tô xanh đặc.
   Kiểu nhạt là cố ý — bộ này chỉ đổi nhóm thống kê đang xem, không đổi công thức.
   Mockup đã duyệt vẽ đúng kiểu nhạt này; đừng "tiện tay" tô đậm cho nổi. */
#trChanDoan .cd-tab button.dang{background:var(--line-soft); color:var(--txt); font-weight:600}

/* Hàng pie chia đều 3 cột (khác hàng KPI: thẻ trái bên đó rộng hơn vì ôm cột chồng). */
#trChanDoan .cd-hang-pie{grid-template-columns:1fr 1fr 1fr}
@media (max-width:1000px){ #trChanDoan .cd-hang-pie{grid-template-columns:1fr} }
/* Điểm ① GĐ2b: pie kiểu dây kéo — canvas choán NGANG thẻ, nhãn vẽ hai bên bánh
   ngay trên canvas, không còn hộp chú giải HTML. */
#trChanDoan .cd-cv-pie{width:100%; height:150px}

/* Khu biểu đồ phân bố Lãi/Lỗ (nhịp 2b). (.cd-nhip2 đã nghỉ — băng giữ chỗ
   rời index.html từ bản #108, giữ luật chết chỉ tổ gây hiểu nhầm.) */
#trChanDoan .cd-pb-loc{display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin:0 0 10px}
#trChanDoan .cd-pb-loc select,#trChanDoan .cd-pb-loc input[type="date"]{
  border:1px solid var(--line); background:var(--panel); color:var(--txt);
  border-radius:8px; padding:5px 8px; font:500 13px var(--font)}
#trChanDoan .cd-pb-lbl{display:inline-flex; align-items:center; gap:5px; font-size:13px;
  color:var(--dim); cursor:pointer}
/* ⚠️ BẮT BUỘC đi kèm dòng trên: `display:inline-flex` của tác giả ĐÈ luật
   [hidden]{display:none} của trình duyệt (tầng author thắng user-agent) — thiếu
   dòng dưới thì `label.hidden = true` trong JS không ẩn được gì, điểm ⑤ GĐ2b
   thành số 0 tròn trĩnh. `soat-loi` bắt 31/08/2026. */
#trChanDoan .cd-pb-lbl[hidden]{display:none}
/* Điểm ⑥ GĐ2b: checkbox vuông → CÔNG TẮC TRÒN xanh (appearance:none + ::before
   làm núm; màu bật = --cd-da-chot, đúng tông teal của bảng chuẩn). Dự án chưa
   có switch nào để chép nên viết mới tại đây, scope chặt trong .cd-pb-lbl. */
#trChanDoan .cd-pb-lbl input[type="checkbox"]{appearance:none; -webkit-appearance:none;
  width:30px; height:16px; border-radius:999px; background:var(--line); position:relative;
  cursor:pointer; margin:0; flex:0 0 auto; transition:background .15s}
/* appearance:none xoá luôn dấu hiệu focus mặc định ⇒ phải tự vẽ vòng focus,
   không thì Tab tới công tắc mà không thấy con trỏ đang ở đâu (`soat-loi` 31/08). */
#trChanDoan .cd-pb-lbl input[type="checkbox"]:focus-visible,
#trChanDoan .cd-hoi:focus-visible{outline:2px solid var(--cool); outline-offset:2px}
#trChanDoan .cd-pb-lbl input[type="checkbox"]::before{content:""; position:absolute;
  top:2px; left:2px; width:12px; height:12px; border-radius:50%; background:#fff;
  box-shadow:0 1px 2px rgba(0,0,0,.25); transition:left .15s}
#trChanDoan .cd-pb-lbl input[type="checkbox"]:checked{background:var(--cd-da-chot)}
#trChanDoan .cd-pb-lbl input[type="checkbox"]:checked::before{left:16px}
#trChanDoan .cd-pb-tong{margin-left:auto; font-size:13px; font-weight:700; color:var(--txt)}
/* Điểm ⑫ GĐ2b: nút Lọc xanh dương đậm + icon kính lúp (SVG stroke=currentColor
   nên tự trắng theo chữ). Ghi đè màu của .nut.phu ngay tại id cho khỏi rò. */
#trChanDoan #cdPbLoc{background:var(--cool); border-color:var(--cool); color:#fff;
  display:inline-flex; align-items:center; gap:5px}
#trChanDoan #cdPbLoc:hover{filter:brightness(1.08)}
#trChanDoan #cdPbLoc svg{width:12px; height:12px; flex:0 0 auto}
/* Đệm trên 30px: dấu (?) absolute (top:10 right:12) cần vùng riêng — canvas
   khu này rộng hết thẻ, đệm 14px như thẻ khác là (?) đè lên góc biểu đồ. */
#trChanDoan .cd-pb-the{min-height:0; padding:30px 16px 14px}
#trChanDoan .cd-pb-thieu{margin:0 0 8px; padding:7px 10px; border-radius:8px; font-size:13px;
  background:var(--nhac-bg); border:1px solid var(--nhac-border); color:var(--nhac-txt)}
#trChanDoan .cd-pb-cuon{overflow-x:auto; overflow-y:hidden}
/* (#133) Nến TỔNG danh mục — ô hẹp bên trái, thang riêng, ngăn bằng thanh dọc mờ (luật giao diện 05/10). Bảng rê chuột
   neo trong ô và được tràn sang phải (ô hẹp hơn bảng) ⇒ ô KHÔNG cắt tràn. Điện thoại: ô nằm trên, khung coin dưới. */
#trChanDoan .cd-pb-hang{display:flex; align-items:stretch; gap:10px}
#trChanDoan .cd-pb-hang > .cd-pb-cuon{flex:1 1 auto; min-width:0}
#trChanDoan .cd-pb-total{position:relative; flex:0 0 128px; padding-right:10px; border-right:1px solid var(--line-soft)}
#trChanDoan .cd-pb-total[hidden]{display:none}
@media (max-width:600px){
  #trChanDoan .cd-pb-hang{flex-direction:column}
  #trChanDoan .cd-pb-total{flex:0 0 auto; padding:0 0 10px; border-right:0; border-bottom:1px solid var(--line-soft)}
}
#trChanDoan .cd-pb-trong{position:relative; width:max-content; min-width:100%}
#trChanDoan .cd-cv-pb{width:100%; height:300px; display:block}
/* (#42) Ngoại hình dời lên khối `.tip-chung` đầu file — còn lại đây là phần RIÊNG:
   neo `absolute` trong khung cuộn `.cd-pb-trong`. */
#trChanDoan .cd-pb-tip{position:absolute; left:0; top:0; pointer-events:none; z-index:5;
  transform:translate(-50%,-100%) translateY(-12px);
  opacity:0; transition:opacity .1s}
#trChanDoan .cd-pb-tip.hien{opacity:1}
#trChanDoan .cd-pb-tip.duoi{transform:translate(-50%,0) translateY(14px)}
#trChanDoan .cd-pb-mp{font-weight:400; opacity:.75}
/* (#41) Bảng rê chuột DÙNG CHUNG cho 5 khung vẽ còn lại của tab Chẩn đoán —
   cột chồng, donut và 3 bánh tròn. `chandoan.js` #10 tự tạo đúng MỘT thẻ này
   rồi gắn vào #trChanDoan, nên index.html không phải thêm DOM nào.
   Khác `.cd-pb-tip` ở đúng một điểm: neo `fixed` theo con trỏ trong toạ độ màn
   hình, vì 5 canvas nằm rải trong nhiều thẻ khác nhau — neo `absolute` là phải
   dựng 5 khung `position:relative` trong index.html. z-index cao hơn .cd-pb-tip
   để nó không chui xuống dưới khung cuộn của biểu đồ phân bổ.
   (#42) Ngoại hình dời lên khối `.tip-chung` đầu file — còn lại đây là phần RIÊNG. */
#trChanDoan .cd-tip{position:fixed; left:0; top:0; pointer-events:none; z-index:60;
  transform:translate(-50%,-100%) translateY(-12px);
  opacity:0; transition:opacity .1s}
#trChanDoan .cd-tip.hien{opacity:1}
#trChanDoan .cd-tip.duoi{transform:translate(-50%,0) translateY(14px)}
#trChanDoan .cd-pb-zoom{display:flex; align-items:center; gap:8px; margin-top:8px;
  font-size:12.5px; color:var(--dim2)}
/* Điểm ⑧ GĐ2b: thanh dataZoom 2 đầu kéo (slider input đã rời index #110).
   Rãnh = toàn dải dữ liệu; cửa sổ .cd-pb-dz-cua = vùng đang nhìn (nền mờ —
   "bóng vùng" của bảng chuẩn); 2 núm .cd-pb-dz-tay kéo đổi cỡ cửa sổ. */
#trChanDoan .cd-pb-dz{position:relative; flex:1; max-width:420px; height:18px;
  border:1px solid var(--line); border-radius:6px; background:var(--line-soft)}
#trChanDoan .cd-pb-dz-cua{position:absolute; top:0; bottom:0; min-width:14px;
  background:rgba(59,130,246,.20); border:1px solid var(--cool); border-radius:5px;
  cursor:grab; touch-action:none}
#trChanDoan .cd-pb-dz-cua:active{cursor:grabbing}
#trChanDoan .cd-pb-dz-tay{position:absolute; top:50%; width:10px; height:14px;
  transform:translateY(-50%); background:var(--cool); border-radius:3px;
  cursor:ew-resize; touch-action:none}
#trChanDoan .cd-pb-dz-tay[data-tay="trai"]{left:-5px}
#trChanDoan .cd-pb-dz-tay[data-tay="phai"]{right:-5px}

/* GĐ3: bảng trong hộp chú thích (modal #ghiChuNen dùng chung với taifu.js —
   selector KHÔNG scope #trChanDoan vì modal nằm ngoài tab; tiền tố cd-gc- riêng). */
/* (#52) 12px → 13px theo yêu cầu "cỡ chữ tăng thêm 1 số" của anh 16/09.
   `min-width:0` vẫn phải giữ nguyên — xem chú thích khối (#52) ở ~dòng 530. */
.cd-gc-bang{border-collapse:collapse; width:100%; font-size:13.5px; margin:6px 0; min-width:0}
.cd-gc-bang th,.cd-gc-bang td{border:1px solid var(--line); padding:5px 7px;
  text-align:left; vertical-align:top}

/* ═══ TAB 4 — TÁI CÂN BẰNG (nhịp B1, 09/09/2026) ══════════════════════
   Mọi lớp mang tiền tố `tcb-` và scope trong `#trTaiCanBang`.
   ⛔ CẤM đặt tên trần kiểu `.len` / `.xuong` / `.mo` — ba tên đó ĐÃ CÓ CHỦ
     toàn cục ở ~dòng 641 với MÀU KHÁC (`--up`/`--down`), `portfolio.js` và
     `taifu.js` đang dùng. Cửa sổ `b67c8514` đặt trùng một lần rồi, `soat-loi`
     bắt được: cùng một chữ `.len` cho hai sắc xanh tuỳ chỗ đứng.
   📌 Dùng lại lớp có sẵn, KHÔNG định nghĩa lại: `.card` `.nut` `.nut.phu`
     `.o-nhap` `.bang` `.loi` `.nhac` `.tip-chung`.
   ⛔ Đừng dùng `--tooltip-bg` (nền tối đời cũ, không bảng nào còn dùng). */

/* Bỏ khoá 1120px — tab Tái cân bằng trải hết vùng nội dung, ĐÚNG KHUÔN 3 TIỀN LỆ
   đã có: `#trGiaodich .wrap` · `#trTaifu .wrap` · `#trChanDoan .wrap`.
   ⚠️ CỐ Ý KHÔNG GHI SỐ DÒNG: số dòng trôi mỗi lần sửa header, đã trả giá ngay trong
   chính mẻ này (12/09/2026 — chú thích ghi 204/208/1077/1646 lấy từ bản TRƯỚC lúc
   cắt bớt lịch sử header, thực tế đã tụt 7 dòng; `soat-loi` bắt được). Tìm 3 tiền lệ
   bằng `grep -n "\.wrap{max-width" style.css` là ra hết trong một giây.
   Luật chung `.wrap{max-width:1120px}` áp cho MỌI tab; ba tab kia đều có một dòng
   gỡ khoá riêng, tab thứ tư này bị SÓT ⇒ nó là tab duy nhất bị bó giữa màn, hai bên
   thừa ~390px trên màn 1900px.
   Anh chốt 12/09/2026: giãn cho giống ba tab kia.
   📌 Dòng chữ mô tả vẫn bó hẹp nhờ `.tcb-mota{max-width:60ch}` ngay dưới — CỐ Ý,
   đừng gỡ: câu văn dài quá 60 ký tự một dòng thì mỏi mắt đọc. */
#trTaiCanBang .wrap{max-width:none}

#trTaiCanBang .tcb-the{position:relative; background:var(--panel); border:1px solid var(--line);
  border-radius:var(--r); box-shadow:var(--shadow); padding:16px 18px; margin-bottom:14px}
#trTaiCanBang .tcb-dau{display:flex; justify-content:space-between; align-items:flex-start; gap:16px; flex-wrap:wrap}
#trTaiCanBang .tcb-nhan{font-size:12px; letter-spacing:.08em; color:var(--dim2); font-weight:600}
#trTaiCanBang .tcb-h1{margin:4px 0 6px; font-size:24px; line-height:1.2}
#trTaiCanBang .tcb-h2{margin:0 0 10px; font-size:16px}
#trTaiCanBang .tcb-mota{color:var(--dim); font-size:13.5px; max-width:60ch}
#trTaiCanBang .tcb-che{display:flex; align-items:center; gap:6px; font-size:13px; color:var(--dim)}
#trTaiCanBang .tcb-nut-che{border:1px solid var(--line); background:var(--panel); color:var(--txt);
  border-radius:9px; padding:6px 12px; font-size:13.5px; cursor:pointer}
#trTaiCanBang .tcb-nut-che.dang{background:var(--cool); border-color:var(--cool); color:#fff}
#trTaiCanBang .tcb-hang{display:flex; gap:12px; align-items:flex-end; flex-wrap:wrap}
#trTaiCanBang .tcb-cum{display:flex; gap:12px; flex-wrap:wrap}
#trTaiCanBang .tcb-nutcum{display:flex; gap:8px; margin-left:auto}
#trTaiCanBang .tcb-kep{margin-top:8px; font-size:13px; color:var(--dim2); min-height:1em}
#trTaiCanBang .tcb-giocap{margin-top:4px; font-size:13px; color:var(--dim2); text-align:right}
#trTaiCanBang .tcb-can-tcb{color:var(--down); font-style:italic; font-size:13.5px; margin-bottom:4px}
#trTaiCanBang .tcb-da-can{color:var(--up); font-size:13.5px; margin-bottom:4px}
#trTaiCanBang .tcb-ghi{color:var(--dim); font-size:13px; margin-bottom:10px}
#trTaiCanBang .tcb-bang table{width:100%; border-collapse:collapse; font-size:13.5px}
#trTaiCanBang .tcb-bang th,#trTaiCanBang .tcb-bang td{border-bottom:1px solid var(--line-soft);
  padding:7px 9px; text-align:left}
#trTaiCanBang .tcb-phai{text-align:right}
#trTaiCanBang .tcb-ban{color:var(--down); font-weight:600}
#trTaiCanBang .tcb-mua{color:var(--up); font-weight:600}
#trTaiCanBang .tcb-mo{color:var(--dim2)}
#trTaiCanBang .tcb-trong{color:var(--dim); text-align:center; padding:14px}
#trTaiCanBang .tcb-dangtai{color:var(--dim); text-align:center}
#trTaiCanBang .tcb-tomtat{display:flex; gap:18px; flex-wrap:wrap; margin-top:12px;
  padding-top:10px; border-top:1px solid var(--line-soft); font-size:13.5px; color:var(--dim)}
#trTaiCanBang .tcb-tomtat b{color:var(--txt); margin-left:4px}
/* Cảnh báo CAM của R20 — nền cam nhạt, KHÔNG phải đỏ: đây là cảnh báo, không chặn. */
#trTaiCanBang .tcb-cam{border-left:3px solid var(--gold)}
/* ⚠️ BẮT BUỘC — lớp `.nhac` đặt `display:flex`, mà luật của tác giả THẮNG
   `[hidden]{display:none}` của trình duyệt. Thiếu dòng này thì băng cam HIỆN
   THƯỜNG TRỰC, rỗng trơn, ngay từ lúc mở tab, và người không biết code sẽ đọc
   nó thành "trang đang hỏng". Cùng bẫy đã ghi ở khối `[hidden]` phía trên (bắt
   lần đầu 31/08/2026 với `.cd-pb-lbl`); lần này vấp lại ở tab Tái cân bằng. */
#trTaiCanBang .tcb-cam[hidden]{display:none}
/* (#50) Chờ máy chủ tính (taicanbang.js #15, D1b — máy chủ tính 2–4,5 s): bảng số của lượt
   TRƯỚC mờ đi để không trông như số mới. KHÔNG ẩn hẳn: anh đang tick / gõ "% mới" ngay trên các bảng
   này, ẩn đi là mất chỗ bấm. Lớp `tcb-cho` do `tcbDangTinh()` gắn vào `#tcbWrap`. */
#trTaiCanBang .tcb-cho .tcb-bang{opacity:.45; transition:opacity .15s}

/* ═══ NHỊP A GĐ2 (12/09/2026) — 3 BẢNG CHI TIẾT ═══
   Chiến lược 1 (Indexing) · giỏ AMMO · Bet Sizes.
   ⛔ MỌI class ở đây bắt buộc tiền tố `tcb-` và scope `#trTaiCanBang`: tên trần
   như `.tong`, `.con`, `.tick` đã có chủ toàn cục với màu KHÁC.
   ⛔ CẤM ghi cứng mã màu #hex — dùng biến (mảnh thư viện `mau-bien-css`), không
   thì đổi sang nền tối là bảng mất chữ.
   ⚠️ Khối này PHẢI đứng TRƯỚC luật `[hidden]` ở cuối file (xem ghi chú dưới). */

/* Hàng tiêu đề NHÓM cột (Thành phần rổ · Danh mục hiện tại · Lệnh cần làm ·
   Danh mục sau tái cân bằng) — nền đậm để mắt tách được 4 nhóm, y mockup gốc. */
#trTaiCanBang .tcb-nhomcot th{background:var(--ink); text-align:center;
  font-weight:600; border-bottom:1px solid var(--line)}
/* Vạch dọc giữa các nhóm, để không đọc lẫn cột của nhóm bên cạnh. */
#trTaiCanBang .tcb-nhomcot th + th{border-left:1px solid var(--line)}

/* Bảng Chỉ số có 30 dòng — mở rộng thì cho cuộn trong khối cao cố định chứ
   không đẩy 3 bảng dưới xuống mất hút. */
#trTaiCanBang .tcb-cuon{max-height:420px; overflow-y:auto}

/* Hàng "Chọn nhanh Top 5/10/15/20". */
#trTaiCanBang .tcb-nhanh{display:flex; align-items:center; gap:8px;
  flex-wrap:wrap; margin-bottom:8px}
#trTaiCanBang .tcb-topn{padding:3px 10px; font-size:13px}
#trTaiCanBang .tcb-xemthem{margin-top:8px; font-size:13px; padding:4px 12px}

/* Ô tick — to hơn mặc định một chút cho dễ bấm, con trỏ hình bàn tay. */
#trTaiCanBang .tcb-tick{width:15px; height:15px; cursor:pointer;
  accent-color:var(--cool); vertical-align:middle}

/* Dòng tổng cuối bảng. */
#trTaiCanBang .tcb-tong td{border-top:1px solid var(--line); font-weight:600;
  background:var(--ink)}

/* Dòng con (Chỉ số / Cơ hội / từng stablecoin) trong bảng Bet Sizes — thụt vào
   để thấy nó thuộc dòng giỏ ngay trên. */
#trTaiCanBang .tcb-con td:first-child{padding-left:26px; color:var(--dim)}

/* Cột "% vốn thực tế" lệch mục tiêu — ĐỎ NHẸ (nền, không phải chữ đỏ): chữ đỏ
   ở đây sẽ lẫn với `.tcb-ban` nghĩa là "lệnh Bán". Hiện chưa dùng — nó chỉ sống
   khi công tắc khoá 64/16 BẬT (nhịp B), xem ghi chú ② trong `taicanbang.js`. */
#trTaiCanBang .tcb-lech{background:var(--down-soft); font-weight:600}

/* ═══ NHỊP B① (13/09/2026) — BẢNG "CHIẾN LƯỢC 2 — GIAO DỊCH CƠ HỘI" ═══
   ⚠️ CẢ KHỐI NÀY PHẢI NẰM TRƯỚC `#trTaiCanBang [hidden]` ở ngay dưới. */

/* Hàng công tắc khoá cứng 64/16 — nằm ngay dưới tiêu đề thẻ Cơ hội. */
#trTaiCanBang .tcb-congtac{display:flex; align-items:center; gap:8px;
  flex-wrap:wrap; margin-bottom:8px}
#trTaiCanBang .tcb-ct-nhan{display:inline-flex; align-items:center; gap:8px;
  cursor:pointer; font-size:13.5px; color:var(--dim)}

/* Ô NHẬP "% mới" — nằm TRONG một ô bảng nên phải gọn, và canh PHẢI cho thẳng
   cột với các con số ở những dòng khác.
   ⚠️ `-moz-appearance:textfield` + ẩn nút xoay của WebKit: hai mũi tên tăng/giảm
   mặc định chiếm gần nửa bề ngang một ô bảng hẹp, đè lên chính con số. */
#trTaiCanBang .tcb-opp-pct{width:78px; text-align:right; font-size:13.5px;
  padding:2px 6px; border:1px solid var(--line); border-radius:5px;
  background:var(--panel); color:var(--txt); -moz-appearance:textfield}
#trTaiCanBang .tcb-opp-pct::-webkit-outer-spin-button,
#trTaiCanBang .tcb-opp-pct::-webkit-inner-spin-button{-webkit-appearance:none; margin:0}
#trTaiCanBang .tcb-opp-pct:focus{outline:none; border-color:var(--cool)}
#trTaiCanBang .tcb-opp-dv{margin-left:4px; font-size:12.5px; color:var(--dim2)}

/* Nút ⊖ — CAM theo mockup. Cam ở đây là "bỏ coin này ra", cố ý KHÔNG dùng đỏ:
   đỏ trong tab này đã mang nghĩa "lệnh Bán" (`.tcb-ban`) và nghĩa "bị chặn". */
/* ⛔ DÙNG BIẾN, KHÔNG GHI CỨNG MÃ MÀU — `soat-loi` bắt 13/09/2026. Bản đầu ghi
   thẳng `#F59E0B`, đúng sắc cam của mockup nhưng CHẾT CỨNG ở nền tối: mọi thứ
   khác dịu xuống, riêng mấy nút ⊖ chói rực trên nền `#0D1117`. Biến
   `--o-tudien-vien` đã có sẵn đúng hai sắc đó (sáng `#F59E0B` · tối `#D29922`),
   nên dùng nó là vừa giữ đúng mockup vừa tự đổi theo nền. */
#trTaiCanBang .tcb-opp-bo{border:1px solid var(--o-tudien-vien); background:transparent;
  color:var(--o-tudien-vien); width:20px; height:20px; line-height:1; border-radius:50%;
  font-size:13.5px; cursor:pointer; padding:0}
#trTaiCanBang .tcb-opp-bo:hover{background:var(--o-tudien-vien); color:var(--ink)}

/* Dòng Tiền dư (R5b) — chỉ hiện khi công tắc BẬT và có dư. Mờ hơn dòng thường
   vì nó KHÔNG nằm trong dòng Tổng ngay trên (xem ghi chú ở `tcbVeBangOpp`). */
#trTaiCanBang .tcb-du td{border-top:1px dashed var(--line); color:var(--dim)}

/* Chữ giải thích nhỏ nằm gọn trong một ô bảng. */
#trTaiCanBang .tcb-ghi-o{font-size:12.5px; color:var(--dim2)}

/* ═══ NHỊP B② (#48) — NÚT ↓/↑ (R14) + CỬA SỔ "THÊM COIN" + THÔNG BÁO NHỎ ═══
   Nút ↓/↑ màu `--cool` (xanh) — cố ý khác ⊖ cam: ⊖ là "bán hết", ↓/↑ chỉ là
   chuyển bảng, không sinh lệnh nào tự thân. Cửa sổ dùng khung chung `#ghiChuNen`
   nên luật viết dưới `#ghiChuNen`, không dưới `#trTaiCanBang` (nó nằm ngoài tab). */
#trTaiCanBang .tcb-keo{border:1px solid var(--line); background:transparent; color:var(--cool);
  width:20px; height:20px; line-height:1; border-radius:6px; font-size:13px; cursor:pointer;
  padding:0; margin-left:4px}
#trTaiCanBang .tcb-keo:hover{border-color:var(--cool)}
#trTaiCanBang .tcb-keo[disabled]{color:var(--dim2); opacity:.45; cursor:not-allowed}
#trTaiCanBang .tcb-them-nut{margin-left:auto}
#ghiChuNen .tcb-them-tim{width:100%; box-sizing:border-box; padding:10px 12px; border-radius:9px;
  border:1px solid var(--line); background:var(--ink); color:var(--txt);
  font-family:var(--font); font-size:14px}
#ghiChuNen .tcb-them-tim:focus{outline:none; border-color:var(--cool)}
#ghiChuNen .tcb-them-dem{font-size:13px; color:var(--dim2); margin:10px 0 6px}
#ghiChuNen .tcb-them-ds{max-height:50vh; overflow-y:auto}
#ghiChuNen .tcb-them-dong{display:flex; justify-content:space-between; gap:12px; width:100%;
  padding:8px 10px; border:0; border-bottom:1px solid var(--line); background:transparent;
  color:var(--txt); font-family:var(--font); font-size:14px; text-align:left; cursor:pointer}
#ghiChuNen .tcb-them-dong:hover{background:var(--ink)}
#ghiChuNen .tcb-them-mo{color:var(--dim2); cursor:default}
#ghiChuNen .tcb-them-mo:hover{background:transparent}
#ghiChuNen .tcb-them-ma{font-weight:600}
#ghiChuNen .tcb-them-gia{color:var(--dim2)}
#ghiChuNen .tcb-them-trong{padding:12px 0; color:var(--dim2)}
#trTaiCanBang .tcb-bao-nho{position:fixed; right:20px; bottom:20px; z-index:60; max-width:360px;
  background:var(--panel); color:var(--txt); border:1px solid var(--line);
  border-left:3px solid var(--cool); border-radius:10px; padding:10px 14px; font-size:13.5px;
  box-shadow:0 10px 30px rgba(15,23,42,.2); display:none}
#trTaiCanBang .tcb-bao-nho.hien{display:block}

/* ═══ #49 — NÚT "?" GIẢI THÍCH TAB TÁI CÂN BẰNG (việc A, 14/09/2026) ═══
   Chép dáng `#trChanDoan .cd-hoi` (nút tròn 15px viền mảnh). Khoá trong `#trTaiCanBang`
   (gd2a ca ⑯). Đứng TRƯỚC khối `[hidden]` cuối file như mọi luật `display` của tab. */
#trTaiCanBang .tcb-hoi{display:inline-flex; align-items:center; justify-content:center; width:15px;
  height:15px; border-radius:50%; border:1px solid var(--line); color:var(--dim2);
  background:none; padding:0; margin-left:4px; font-family:var(--font); line-height:1;
  font-size:11px; font-weight:600; cursor:pointer; vertical-align:middle; text-transform:none}
#trTaiCanBang .tcb-hoi:hover{background:var(--line-soft); color:var(--txt)}
#trTaiCanBang .tcb-hoi:focus-visible{outline:2px solid var(--cool); outline-offset:2px}
/* Nút ? trong ô đỏ chặn tính — to + viền đỏ cho dễ thấy (anh chốt 14/09). */
#trTaiCanBang .tcb-hoi.tcb-hoi-loi{width:20px; height:20px; font-size:13.5px; font-weight:700;
  border:1.5px solid currentColor; color:inherit; margin-left:6px}
#trTaiCanBang .tcb-hoi.tcb-hoi-loi:hover{color:#fff; background:var(--down)}

/* ═══ LUẬT "GIẤU ĐI" CHO CẢ TAB — THÊM 12/09/2026, anh chốt sửa tận gốc ═══
   VÌ SAO PHẢI CÓ: `[hidden]{display:none}` là luật của TRÌNH DUYỆT, luôn thua
   luật của tác giả. Mọi lớp trong tab này đặt `display:flex` (`.nhac` dòng 934,
   `.tcb-cum` dòng 1860…) đều nuốt mất `hidden` ⇒ JS bật cờ ẩn mà thẻ vẫn nằm
   chình ình. Dự án vấp ĐÚNG BẪY NÀY BA LẦN: `.cd-pb-lbl` (31/08) · `.tcb-cam`
   (việc 4l②) · `#tcbChiDuong` + `#tcbCu` (12/09). Hai lần đầu vá lẻ từng lớp,
   nên lần thứ ba vẫn vấp.
   ⇒ Luật dưới đây phủ CẢ TAB: thẻ mới sau này ẩn được ngay, không phải nhớ gì.
   📌 Nó cũng chữa một bệnh ĐANG SỐNG TRÊN TRANG THẬT từ bản #5, không do đợt này
   đẻ ra: `#tcbOTcb` / `#tcbOChot` (hai hàng ô nhập của hai chế độ) mang
   `.tcb-cum{display:flex}` mà không có luật `[hidden]` nào ⇒ HAI HÀNG CÙNG HIỆN,
   bấm đổi chế độ không giấu được hàng nào.
   ⚠️ ĐẶT Ở CUỐI FILE LÀ CỐ Ý: `#trTaiCanBang [hidden]` và `#trTaiCanBang .tcb-cum`
   có sức nặng NGANG NHAU, nên cái đứng SAU mới thắng. Thêm luật `display` nào cho
   tab này thì phải đặt TRƯỚC khối này, đừng chèn xuống dưới. */
#trTaiCanBang [hidden]{display:none}

/* ═══ BỘ 3 TAB NGÂN SÁCH · CÂN ĐỐI · ĐIỀU KHIỂN — `ngansach.js` (NS-2 GĐ2, 17/09/2026) ═══
   Luật tên: mọi lớp mang tiền tố `ns-` và bó trong `.ns-wrap` (3 khung ở index.html) hoặc
   `#ghiChuNen .ns-hop` (hộp Tạo/Sửa bộ nằm trong khung nổi dùng chung). Dải vàng dùng lại `.nhac`.
   Luật bề ngang §26 BAN_DO: 3 khung mới trải hết vùng nội dung như 4 tab trước. */
#trNganSach .wrap{max-width:none}
#trCanDoi .wrap{max-width:none}
#trDieuKhien .wrap{max-width:none}
.ns-wrap .ns-dau{margin:4px 0 18px}
.ns-wrap .ns-nhan{display:inline-block; padding:4px 10px; border-radius:8px; background:var(--cool-soft);
  color:var(--cool); font-size:12px; font-weight:700; letter-spacing:.06em}
.ns-wrap .ns-h1{margin:12px 0 8px; font-size:30px; line-height:1.2}
.ns-wrap .ns-mota{margin:0; color:var(--dim); font-size:14px; line-height:1.6; max-width:80ch}
.ns-wrap .ns-thanh{display:flex; flex-wrap:wrap; align-items:flex-end; gap:12px 16px; padding:14px 16px;
  background:var(--panel); border:1px solid var(--line); border-radius:var(--r); box-shadow:var(--shadow)}
.ns-wrap .ns-o{display:flex; flex-direction:column; gap:5px; min-width:0}
.ns-wrap .ns-o-nhan{font-size:12.5px; color:var(--dim)}
.ns-wrap .ns-chon, .ns-wrap .ns-dm{min-width:190px; max-width:100%; box-sizing:border-box; padding:8px 10px;
  border:1px solid var(--line); border-radius:9px; background:var(--panel); color:var(--txt);
  font-family:var(--font); font-size:14px}
.ns-wrap .ns-o-nam .ns-chon{min-width:96px}
.ns-wrap .ns-dm{background:var(--line-soft)}
.ns-wrap .ns-nutcum{display:flex; flex-wrap:wrap; gap:8px}
.ns-wrap .nut.phu.ns-nut-tao{color:var(--cool); border-color:var(--cool)}
.ns-wrap .nut.phu.ns-nut-xoa{color:var(--down)}
.ns-wrap .ns-capnhat{margin-left:auto; align-self:center; font-size:13px; color:var(--dim2)}
.ns-wrap .nhac.ns-dai{margin-top:12px}
.ns-wrap .ns-bao{margin-top:12px; padding:10px 14px; border-radius:10px; font-size:13.5px}
.ns-wrap .ns-bao-cho{background:var(--cool-soft); color:var(--cool)}
.ns-wrap .ns-bao-loi{background:var(--down-soft); color:var(--down)}
.ns-wrap .ns-bao-canh{background:var(--nhac-bg); color:var(--nhac-txt); border:1px solid var(--nhac-border)}
.ns-wrap .ns-khung{margin-top:16px; padding:40px 20px; background:var(--panel); border:1px dashed var(--line);
  border-radius:var(--r); text-align:center; color:var(--dim)}
.ns-wrap .ns-khung-chu{font-size:15px}
.ns-wrap .ns-khung-nut{margin-top:14px}
.ns-wrap .ns-dangdung .ns-khung-chu{color:var(--dim2); font-size:14px}
/* Hộp Tạo/Sửa bộ HẸP như hộp "⟲ Các khoản" trong ảnh, không ăn theo bề rộng 1120px của hộp chữ (?)
   (#52). Ẩn nút "Đóng" ở chân khung chung — hộp đã có Huỷ/Lưu, hai nút thoát là thừa (ảnh chỉ có
   Huỷ/Lưu). Dùng `:has` để KHÔNG phải sửa khối B2 trong index.html (khối đó canh `gc-hep` cho tcb). */
#ghiChuNen .hop:has(.ns-hop){max-width:min(600px, 92vw)}
#ghiChuNen .hop:has(.ns-hop) > .chan{display:none}
#ghiChuNen .ns-hop{display:flex; flex-direction:column; gap:12px}
#ghiChuNen .ns-hop .hang{margin-bottom:0}
#ghiChuNen .ns-h-nhan{font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:var(--dim2); font-weight:700}
#ghiChuNen .ns-h-cuon{overflow-x:auto}
/* Đè luật toàn cục `table{min-width:900px}` (⛔ không sửa luật đó) — thiếu là bảng người tràn hộp. */
#ghiChuNen .ns-h-bang{min-width:0; width:100%; font-size:13.5px}
#ghiChuNen .ns-h-bang thead th{padding:6px; font-size:11.5px}
#ghiChuNen .ns-h-bang td{padding:5px 6px; border-bottom:1px solid var(--line-soft); vertical-align:middle}
#ghiChuNen .ns-h-bang input[type="text"], #ghiChuNen .ns-h-bang input[type="number"], #ghiChuNen .ns-h-bang select{
  width:100%; min-width:90px; box-sizing:border-box; padding:7px 8px; border:1px solid var(--line); border-radius:8px;
  background:var(--ink); color:var(--txt); font-family:var(--font); font-size:13.5px}
#ghiChuNen .ns-h-bang .ns-h-giua{text-align:center}
#ghiChuNen .ns-h-hangnut{display:flex; align-items:center; gap:12px; flex-wrap:wrap}
#ghiChuNen .ns-h-dem{font-size:13.5px; color:var(--dim)}
#ghiChuNen .ns-h-ghi{font-size:13.5px; color:var(--dim); background:var(--line-soft); padding:8px 10px; border-radius:8px}
/* NS-3 (#60): hộp (?) HAI LỚP — 8 điểm xếp dọc + khối 🎓 LỜI THẦY gập sẵn. Bảng số trong lời thầy đè `table{min-width:900px}` toàn cục. */
#ghiChuNen .ns-h-diem{display:flex; flex-direction:column; gap:6px}
#ghiChuNen .ns-thay{border:1px solid var(--line); border-radius:8px; padding:8px 12px; font-size:13.5px; line-height:1.55}
#ghiChuNen .ns-thay summary{cursor:pointer; font-weight:700; color:var(--cool)}
#ghiChuNen .ns-thay p, #ghiChuNen .ns-thay ul{margin:8px 0}
#ghiChuNen .ns-thay blockquote{margin:8px 0; padding:6px 10px; border-left:3px solid var(--cool); background:var(--line-soft)}
#ghiChuNen .ns-thay-bang{min-width:0; width:100%; border-collapse:collapse; font-size:13.5px; margin:8px 0}
#ghiChuNen .ns-thay-bang th, #ghiChuNen .ns-thay-bang td{border:1px solid var(--line); padding:4px 8px; text-align:left}
/* NS-3b (#61): câu nguồn cuối hộp (?) + hai hộp 🟡/🔵 cuối tab Ngân sách (gập sẵn). */
#ghiChuNen .ns-h-nguon{font-size:13px; color:var(--dim); border-top:1px dashed var(--line); padding-top:8px}
.ns-wrap .ns-khac-cum{margin-top:20px; display:flex; flex-direction:column; gap:8px}
.ns-wrap .ns-khac{border:1px solid var(--line); border-radius:var(--r); padding:8px 14px; font-size:13.5px; color:var(--dim); background:var(--panel)}
.ns-wrap .ns-khac summary{cursor:pointer; font-weight:700; color:var(--txt)}
.ns-wrap .ns-khac ul{margin:8px 0 2px; padding-left:20px; display:flex; flex-direction:column; gap:4px}
.ns-wrap .ns-khac-vang{border-left:4px solid #f5b301}
.ns-wrap .ns-khac-xanh{border-left:4px solid var(--cool)}
#ghiChuNen .ns-h-loi{font-size:13.5px; color:var(--down); background:var(--down-soft); padding:8px 10px; border-radius:8px}
#ghiChuNen .ns-h-xoa{color:var(--down)}
#ghiChuNen .ns-h-nut{display:flex; justify-content:flex-end; gap:10px}

/* ── NS-2 GĐ3 (#54): bảng 12 tháng tab Ngân sách + hộp khoản / ⟲ các khoản / hạng mục ──
   Bảng đè `table{min-width:900px}` + `tbody td{padding:13px 14px}` toàn cục bằng lớp riêng (⛔ không sửa luật chung);
   14 cột ⇒ cuộn ngang TRONG khung, trang không tràn. Tháng tương lai MỜ (§9.A mục 2) · lệnh đang chờ kho đệm ⇒ `ns-cho`. */
.ns-wrap .ns-hoi{margin-left:6px; width:24px; height:24px; border-radius:50%; border:1px solid var(--line);
  background:var(--panel); color:var(--dim); font-size:13.5px; font-weight:700; cursor:pointer; vertical-align:middle}
.ns-wrap .ns-hoi:hover{color:var(--cool); border-color:var(--cool)}
.ns-wrap .ns-dai-mo{cursor:pointer; text-decoration:underline dotted}
.ns-wrap .ns-bang-khung{margin-top:16px; background:var(--panel); border:1px solid var(--line); border-radius:var(--r); box-shadow:var(--shadow)}
.ns-wrap .ns-bang-khung .ns-bao{margin:12px 14px 0}
.ns-wrap .ns-bang-goiy{padding:10px 14px; font-size:13.5px; font-style:italic; color:var(--dim)}
.ns-wrap .ns-bang-cuon{overflow-x:auto}
.ns-wrap .ns-bang{min-width:1180px; font-size:13.5px; font-variant-numeric:tabular-nums}
.ns-wrap .ns-bang thead th{padding:10px 8px; background:var(--line-soft)}
.ns-wrap .ns-bang td{padding:7px 8px; border-bottom:1px solid var(--line-soft)}
.ns-wrap .ns-bang .ns-c-ten{text-align:left; white-space:nowrap; min-width:130px}
.ns-wrap .ns-bang .ns-c-so{text-align:right; white-space:nowrap}
.ns-wrap .ns-bang .ns-c-tong{font-weight:700}
.ns-wrap .ns-bang .ns-c-nut{white-space:nowrap; text-align:right; width:1%}
.ns-wrap .ns-bang .ns-c-chu{color:var(--dim2); font-style:italic}
.ns-wrap .ns-bang .ns-tuonglai{color:var(--dim2); opacity:.55}
.ns-wrap .ns-dong-nhom td{padding-top:16px; font-size:12px; font-weight:700; letter-spacing:.07em; text-transform:uppercase; border-bottom:0}
.ns-wrap .ns-nhom-thu td{color:var(--up)}
.ns-wrap .ns-nhom-chi td{color:var(--down)}
.ns-wrap .ns-dong:hover td{background:var(--line-soft)}
.ns-wrap .ns-dong-tong td{background:var(--line-soft); font-weight:700; border-bottom:0}
.ns-wrap .ns-dong-tong .ns-c-ten{text-transform:uppercase; font-size:13px; letter-spacing:.04em}
.ns-wrap .ns-tong-rong .ns-c-so{color:var(--up)}
.ns-wrap .ns-tong-rong .ns-c-so.ns-am{color:var(--down)}
.ns-wrap .ns-nut-o{width:24px; height:24px; margin-left:3px; padding:0; border-radius:6px; border:1px solid var(--line);
  background:var(--panel); font-size:13px; line-height:1; cursor:pointer}
.ns-wrap .ns-nut-o:disabled{opacity:.45; cursor:not-allowed}
.ns-wrap .ns-nut-them{color:var(--up)}
.ns-wrap .ns-nut-xoahm{color:var(--down)}
.ns-wrap .ns-nut-lichsu{color:var(--cool)}
.ns-wrap .ns-cho, #ghiChuNen .ns-cho{opacity:.6}
.ns-wrap .ns-xoa .ns-c-ten, .ns-wrap .ns-xoa .ns-c-so, #ghiChuNen .ns-xoa td{text-decoration:line-through}
.ns-wrap .ns-bang-chan{display:flex; flex-wrap:wrap; align-items:center; gap:10px 16px; padding:12px 14px; border-top:1px solid var(--line-soft)}
.ns-wrap .ns-ghichu{font-size:13.5px; color:var(--dim); white-space:pre-wrap}
/* Hộp ⟲ Các khoản / khoản ngoài năm RỘNG hơn hộp bộ (2 cột: hạng mục · khoản). */
#ghiChuNen .hop:has(.ns-hop-rong){max-width:min(860px, 94vw)}
#ghiChuNen .ns-l-khung{display:flex; gap:14px; align-items:flex-start}
#ghiChuNen .ns-l-trai{display:flex; flex-direction:column; gap:2px; width:170px; flex:none; max-height:52vh; overflow-y:auto;
  padding-right:8px; border-right:1px solid var(--line-soft)}
#ghiChuNen .ns-l-hm{all:unset; box-sizing:border-box; cursor:pointer; padding:6px 9px; border-radius:7px; font-size:13.5px; color:var(--dim)}
#ghiChuNen .ns-l-hm:hover{background:var(--line-soft); color:var(--txt)}
#ghiChuNen .ns-l-hm.dang{background:var(--cool-soft); color:var(--cool); font-weight:600}
#ghiChuNen .ns-l-phai{flex:1; min-width:0; display:flex; flex-direction:column; gap:8px}
#ghiChuNen .ns-l-dau{display:flex; justify-content:space-between; font-size:13.5px; color:var(--dim)}
#ghiChuNen .ns-l-tong{font-weight:700; color:var(--txt)}
#ghiChuNen .ns-l-cuon{max-height:52vh; overflow:auto}
#ghiChuNen .ns-l-bang td.p, #ghiChuNen .ns-l-bang th.p{text-align:right; white-space:nowrap}
#ghiChuNen .ns-l-nut{white-space:nowrap; text-align:right}
#ghiChuNen .ns-l-nut .nut{margin-left:4px}
#ghiChuNen .ns-l-ngoai{font-size:11.5px; padding:1px 6px; border-radius:6px; background:var(--nhac-bg); color:var(--nhac-txt)}
#ghiChuNen .ns-k-laphang{display:flex; align-items:center; gap:8px; font-size:13.5px; color:var(--txt)}
@media (max-width:640px){
  #ghiChuNen .ns-l-khung{flex-direction:column}
  #ghiChuNen .ns-l-trai{width:100%; flex-direction:row; flex-wrap:wrap; max-height:none; border-right:0; padding-right:0}
}
/* ---- NS-2 GĐ4 nhịp 4A — tab Bảng cân đối (cây 2 cột) + thanh cuộn tối trong hộp ---- */
.ns-wrap .ns-bang.ns-bang-cd{min-width:560px}
.ns-wrap .ns-bang-cd .ns-c-so{width:22%}
.ns-wrap .ns-cd-dau{padding:12px 14px 4px}
.ns-wrap .ns-cd-ten{font-size:15px; font-weight:700; color:var(--txt)}
.ns-wrap .ns-cd-phu{margin-top:4px; font-size:13.5px; color:var(--dim)}
.ns-wrap .ns-cd-nhom td{font-weight:600; background:transparent}
.ns-wrap .ns-cd-gap{all:unset; cursor:pointer; width:16px; display:inline-block; text-align:center; color:var(--dim)}
.ns-wrap .ns-cd-muc .ns-c-ten, .ns-wrap .ns-cd-coin .ns-c-ten{padding-left:30px; color:var(--dim)}
.ns-wrap .ns-cd-chan{padding:12px 14px; border-top:1px solid var(--line-soft); font-size:14px; color:var(--txt)}
/* Chế độ tối: thanh cuộn trong hộp ⟲ theo tông tối (nghiệm thu GĐ3 bước 8 — trước là thanh trắng chói). */
[data-theme="dark"] #ghiChuNen, [data-theme="dark"] .ns-wrap .ns-bang-cuon{color-scheme:dark}
/* ---- NS-2 GĐ4 nhịp 4B — tab Bảng điều khiển phần trên (thẻ · phương trình · đồng hồ đầu tư · 3 xô) ---- */
.ns-wrap .ns-dk{display:flex; flex-direction:column; gap:14px}
.ns-wrap .ns-dk-4the{display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:12px}
.ns-wrap .ns-dk-the{display:flex; flex-direction:column; gap:2px; padding:10px 14px; border-radius:10px; background:var(--line-soft)}
.ns-wrap .ns-dk-the span, .ns-wrap .ns-dk-o span{font-size:12.5px; color:var(--dim)}
.ns-wrap .ns-dk-the b{font-size:15px; color:var(--txt)}
.ns-wrap .ns-dk-pt{display:flex; align-items:center; gap:10px}
.ns-wrap .ns-dk-mau{position:relative; flex:1; min-width:0; display:flex; flex-direction:column; align-items:center; gap:6px; padding:18px 12px;
  border-radius:12px; color:#fff}
.ns-wrap .ns-dk-mau span{font-size:14px; font-weight:600; opacity:.95}
.ns-wrap .ns-dk-mau b{font-size:24px; font-variant-numeric:tabular-nums}
.ns-wrap .ns-dk-ts{background:linear-gradient(90deg,#2446b8,#9aa8f0)}
.ns-wrap .ns-dk-no{background:linear-gradient(90deg,#b81d24,#f09a9a)}
.ns-wrap .ns-dk-rong{background:linear-gradient(90deg,#b0560c,#f5dc86)}
.ns-wrap .ns-dk-sua{all:unset; position:absolute; top:8px; right:10px; cursor:pointer; opacity:.7; font-size:13px}
.ns-wrap .ns-dk-sua:hover{opacity:1}
.ns-wrap .ns-dk-dau{font-size:22px; color:var(--dim)}
.ns-wrap .ns-dk-hai{display:grid; grid-template-columns:minmax(0,4fr) minmax(0,8fr); gap:14px}   /* 4:8 (anh 18/09) ⇒ khung phải đủ chỗ 3 thùng một hàng */
.ns-wrap .ns-dk-khung{display:flex; flex-direction:column; gap:12px; padding:0 14px 14px; border:1px solid var(--line); border-radius:12px; background:var(--panel)}
.ns-wrap .ns-dk-tieude{margin:0 -14px; padding:10px 14px; text-align:center; font-weight:700; background:var(--line-soft); border-radius:12px 12px 0 0}
.ns-wrap .ns-dk-pt3{display:flex; align-items:center; gap:8px}
.ns-wrap .ns-dk-o{flex:1; min-width:0; display:flex; flex-direction:column; align-items:center; gap:2px; padding:8px; border-radius:8px; background:var(--line-soft); text-align:center}
.ns-wrap .ns-dk-kimdt{display:flex; gap:14px; align-items:flex-start}
.ns-wrap .ns-dk-dhbox{flex:none; width:180px; text-align:center}
.ns-wrap .ns-dh{width:180px; height:110px}
.ns-wrap .ns-dh-cung{fill:none; stroke-width:14}
.ns-wrap .ns-dh-cung.ns-do{stroke:var(--down)} .ns-wrap .ns-dh-cung.ns-vang{stroke:#f0a020} .ns-wrap .ns-dh-cung.ns-xanh{stroke:var(--up)}
.ns-wrap .ns-dh-vach{stroke:var(--dim); stroke-width:1}
.ns-wrap .ns-dh-so{font-size:9px; fill:var(--dim)}
.ns-wrap .ns-dh-kim{stroke:var(--txt); stroke-width:3; stroke-linecap:round}
.ns-wrap .ns-dh-tam{fill:var(--txt)}
.ns-wrap .ns-dh-chu{font-size:20px; font-weight:700}
.ns-wrap .ns-do{color:var(--down)} .ns-wrap .ns-vang{color:#d98a00} .ns-wrap .ns-xanh{color:var(--up)}
.ns-wrap .ns-dk-giai{flex:1; min-width:0; display:flex; flex-direction:column; gap:8px; font-size:13.5px}
.ns-wrap .ns-dk-nho{font-size:13px; color:var(--dim)}
.ns-wrap .ns-dk-kn{display:flex; flex-direction:column; gap:3px; font-size:13.5px}
.ns-wrap .ns-dk-link{all:unset; cursor:pointer; align-self:center; font-size:13.5px; color:var(--cool)}
.ns-wrap .ns-dk-link:hover{text-decoration:underline}
.ns-wrap .ns-dk-xam{font-size:13.5px; color:var(--dim); font-style:italic; text-align:center}
.ns-wrap .ns-dk-tongdm{text-align:center; color:var(--cool); font-size:14px}
.ns-wrap .ns-xo{display:flex; flex-direction:column; align-items:center; gap:4px; min-width:0}
.ns-wrap .ns-xo-ten{font-size:12px; font-weight:700; letter-spacing:.05em; color:var(--cool)}
.ns-wrap .ns-xo-than{position:relative; width:100%; height:130px; display:flex; border:2px solid var(--line); border-top-width:6px; border-radius:0 0 12px 12px; overflow:hidden}
.ns-wrap .ns-xo-rong{align-items:center; justify-content:center; color:var(--dim)}
.ns-wrap .ns-dk-huong{font-size:13.5px; font-weight:600; color:var(--txt)}
/* Xô rỗng "—" (coRo=false) giữ hộp đơn giản. */
.ns-wrap .ns-xo-than{overflow:visible; border-color:#b9bec6; background:linear-gradient(90deg,#f4f5f7,#e3e6ea 50%,#f4f5f7)}
[data-theme="dark"] .ns-wrap .ns-xo-than{background:linear-gradient(90deg,#2a2f37,#343a44 50%,#2a2f37)}
/* ---- CÁI CÂN ĐỘNG (anh chốt 18/09 ~19:40) — px theo mã vẽ thầy (PPL §14 E8); đòn quay theo tỷ trọng thô y file mẫu
   `File-MD/AI-to-AI/can-dau-tu.html`. Đòn xoay `--goc`, mỗi đĩa xoay ngược `−--goc` quanh điểm móc, CÙNG hoạt ảnh
   ⇒ xô luôn đứng thẳng cả lúc đang chạy. Tâm đòn = đỉnh trụ (340, 276) trong khung 660×420, mặt kim treo dưới (tâm 340, 330); nửa đòn 172,5 = tâm 2 thùng thầy.
   Màu thùng / cân / mặt kim CỐ ĐỊNH (vật thể sáng màu) — chế độ tối không đổi, chữ trong thùng luôn tối. ---- */
.ns-wrap .ns-can-cuon{overflow-x:auto; overflow-y:hidden}
/* `safe center`: hẹp hơn nội dung thì dồn TRÁI để phần thừa chỉ tràn sang PHẢI — căn giữa thường tràn đều hai phía, phần tràn
   bên trái khung cuộn không bao giờ kéo tới được (soat-loi 18/09 ①: màn < 1500px mất chữ "*Chỉ số", mất nhãn ≥ 64 %). */
/* KHÔNG xuống dòng (anh 18/09 ~22:40, giống thầy): màn hẹp thì xô Sinh hoạt khuất bên phải, kéo thanh trượt ngang dưới để xem. */
.ns-wrap .ns-can-hang{display:flex; flex-wrap:nowrap; align-items:center; justify-content:center; justify-content:safe center; gap:6px 10px; padding-bottom:4px;
  zoom:.85}   /* thu cả cụm cân + xô Sinh hoạt còn 85 % (anh 18/09) ⇒ 880 × .85 ≈ 750px, 3 thùng một hàng như thầy */
.ns-wrap .ns-can-hang > .ns-xo{width:175px; flex:none}
.ns-wrap .ns-can-cot{display:flex; flex-direction:column; align-items:center; gap:6px}
.ns-wrap .ns-can-cot .ns-dk-tongdm{font-weight:700}
.ns-wrap .ns-can-khung{position:relative; width:660px; height:420px; flex:none; margin-top:20px}   /* chừa nhãn "Hiện tại" nhích trên chữ mục tiêu lúc đòn nghiêng tối đa */
.ns-wrap .ns-can-de{position:absolute; left:0; top:0}
.ns-wrap .ns-can-tru-hinh{fill:#8d939b}
.ns-wrap .ns-can-don{position:absolute; left:167.5px; top:276px; width:345px; height:0; z-index:1;
  transform-origin:172.5px 0; transform:rotate(var(--goc)); animation:nsDon .9s ease-out both}
.ns-wrap .ns-can-don-thanh{position:absolute; left:-7px; right:-7px; top:-6px; height:12px; border-radius:6px;
  background:linear-gradient(#c6cbd1,#7c828a); box-shadow:0 2px 4px rgba(0,0,0,.25)}
.ns-wrap .ns-can-dia{position:absolute; top:0; width:0; height:0; transform:rotate(calc(var(--goc) * -1)); animation:nsDia .9s ease-out both}
.ns-wrap .ns-can-dia-trai{left:0}
.ns-wrap .ns-can-dia-phai{left:345px}
.ns-wrap .ns-can-dia-hinh{position:absolute; left:-82px; top:-30px; overflow:visible}
.ns-wrap .ns-can-dia-bat{fill:#979da5; stroke:#6f757d; stroke-width:1.5}
.ns-wrap .ns-can-dia-chan{fill:#7a8088}
.ns-wrap .ns-can-dia .ns-thung{position:absolute; left:-87.5px; top:-216px}
@keyframes nsDon{from{transform:rotate(var(--tu))} to{transform:rotate(var(--goc))}}
@keyframes nsDia{from{transform:rotate(calc(var(--tu) * -1))} to{transform:rotate(calc(var(--goc) * -1))}}
@keyframes nsMuc{from{height:var(--mucTu)} to{height:var(--muc)}}
/* Thùng 175×190 — nước / vạch / chữ theo đúng px thầy (Chỉ số trái 16 rộng 75 · Cơ hội phải 8 rộng 75 · Đạn phải 8 rộng 150). */
.ns-wrap .ns-thung{position:relative; width:175px; height:190px; color:#1f2430}
.ns-wrap .ns-thung-hinh{position:absolute; left:0; top:0; overflow:visible}
.ns-wrap .ns-thung-quai{fill:none; stroke:#98a0aa; stroke-width:2}
.ns-wrap .ns-thung-vien{stroke:#a3aab4; stroke-width:1.5}
.ns-wrap .ns-thung-gan{stroke:#cdd2d9; stroke-width:1}
.ns-wrap .ns-thung-chia{stroke:#4b5260; stroke-width:1.2}
.ns-wrap .ns-thung-tai{fill:#b3bac4}
.ns-wrap .ns-thung-ten{font-size:12.5px; font-weight:800; fill:#3558d6; text-anchor:middle; letter-spacing:.04em}
.ns-wrap .ns-thung-ten.ns-ten-sh{fill:#1b8a44}
.ns-wrap .ns-thung-phu{font-size:9px; font-weight:700; fill:#3558d6; text-anchor:middle}
.ns-wrap .ns-thung-long{position:absolute; left:0; top:0; right:0; bottom:0; clip-path:polygon(8px 24px,167px 24px,157px 190px,18px 190px)}
.ns-wrap .ns-xo-nuoc{position:absolute; bottom:0; background:#3a7bd5}
.ns-wrap .ns-xo-mt{position:absolute; border-top:2px dashed #ca8a04}
.ns-wrap .ns-nuoc-1, .ns-wrap .ns-mt-1{left:16px; width:75px}
.ns-wrap .ns-nuoc-2, .ns-wrap .ns-mt-2{right:8px; width:75px}
.ns-wrap .ns-nuoc-dan, .ns-wrap .ns-mt-dan{right:8px; width:150px}
/* Nhãn "Hiện tại" CẠNH thùng, cùng cỡ chữ "Mục tiêu TaiFu" (anh chốt 18/09 ~22:40): 3 dòng × 12px = 36 (khớp NHAN_CAO trong
   ngansach.js — đổi line-height là phải đổi cả hai). `bottom` do trang gán. Trái: mép phải nhãn ở x=2 · phải: mép trái ở x=178.
   Màu xanh nước (khác cam của mục tiêu) — đọc được cả nền sáng lẫn tối. Đường kẻ + chấm là SVG phủ khít thùng 175×190. */
.ns-wrap .ns-xo-nhan{position:absolute; width:max-content; min-width:64px; font-size:11.5px; font-weight:700; line-height:12px;
  text-align:center; white-space:nowrap; color:#3a7bd5}
.ns-wrap .ns-nhan-trai{right:173px}
.ns-wrap .ns-nhan-phai{left:178px}
.ns-wrap .ns-xo-chi{position:absolute; left:0; top:0; overflow:visible; pointer-events:none; z-index:1}
.ns-wrap .ns-xo-chi line{stroke:#6b7280; stroke-width:1.5}
.ns-wrap .ns-xo-chi circle{fill:#1f2430; stroke:#fff; stroke-width:1.5}
.ns-wrap .ns-xo-mtchu{position:absolute; width:64px; transform:translateY(100%); font-size:11.5px; font-weight:700; line-height:1.2;
  color:#ca8a04; text-align:center}
.ns-wrap .ns-mtchu-trai{left:-60px}
.ns-wrap .ns-mtchu-phai{left:176px; transform:none}   /* bên phải nằm TRÊN vạch — nằm dưới thì xô GIỮ chìm xuống là mặt kim che mất */
/* Mặt kim 3 cung ở trụ giữa (đứng yên) + biển xám dưới. Cung nhận rê chuột ⇒ hộp `tip-chung`. */
.ns-wrap .ns-can-mat{position:absolute; left:290px; top:280px; width:100px; height:100px; z-index:2}
/* Núm trục: điểm tựa ở ĐỈNH TRỤ (y file mẫu can-dau-tu.html), mặt kim treo dưới — đòn nghiêng không quét qua mặt kim. */
.ns-wrap .ns-can-truc{position:absolute; left:331px; top:267px; width:18px; height:18px; border-radius:50%; z-index:2;
  background:radial-gradient(circle at 35% 35%,#eef0f3,#8d939b); border:2px solid #6f757d}
.ns-wrap .ns-can-mathinh{display:block; overflow:visible}
.ns-wrap .ns-can-vanh{fill:#e4e7eb; stroke:#a9b0b9; stroke-width:2}
.ns-wrap .ns-can-cung{fill:none; stroke-width:14; cursor:help; pointer-events:stroke}
.ns-wrap .ns-can-cung:hover{filter:brightness(1.15)}
.ns-wrap .ns-cung-xanh{stroke:#2f9e44}
.ns-wrap .ns-cung-vang{stroke:#f0a020}
.ns-wrap .ns-cung-do{stroke:#e03131}
.ns-wrap .ns-can-long{fill:#fff; stroke:#cfd4da}
.ns-wrap .ns-can-mat text{pointer-events:none; text-anchor:middle; dominant-baseline:central; font-weight:700}
.ns-wrap .ns-can-chuvanh{font-size:8px; fill:#fff}
.ns-wrap .ns-can-kim path, .ns-wrap .ns-can-tam{fill:#1b1e24}
.ns-wrap .ns-can-bien{position:absolute; left:265px; top:368px; width:150px; padding:3px 6px; z-index:3; border:2px solid #a9b0b9;
  border-radius:9px; background:#5f656d; color:#fff; font-size:11.5px; font-weight:700; line-height:1.25; text-align:center}
.ns-wrap .ns-can-ghichu{align-self:flex-start; font-style:italic}
.ns-wrap .ns-can-nut{display:flex; justify-content:center}
/* Chỉ vị trí + bề rộng — ngoại hình (nền, viền, bóng) là của `.tip-chung` dùng chung. */
.ns-wrap .ns-tip{position:fixed; z-index:50; max-width:280px; white-space:normal; pointer-events:none}
.ns-wrap .ns-tip-ten{font-weight:700}
/* Xô SINH HOẠT 210 (thùng bạc 200×215, nước xanh; nhãn vạch cam nằm DƯỚI thùng) — mực nước = hienThi ÷ 200 × 180px, vạch cam ở 90px.
   Màn hẹp: hàng xô KHÔNG xuống dòng — xô này khuất bên phải, kéo thanh trượt ngang (anh 18/09 ~22:40). Chữ có nền trắng mờ ⇒ đọc được trên bạc lẫn nước. */
.ns-wrap .ns-xo-sh{position:relative; width:210px; flex:none}   /* (660 + 10 + 210) × zoom .85 ≈ 750px một hàng */
.ns-wrap .ns-sh-thung{position:relative; width:200px; height:215px; margin:0 auto; color:#1f2430; font-size:11px; font-weight:700; line-height:1.3; text-align:center}
.ns-wrap .ns-sh-long{clip-path:polygon(8px 26px,192px 26px,180px 215px,20px 215px)}
.ns-wrap .ns-sh-nuoc{position:absolute; left:0; right:0; bottom:0; height:var(--muc); background:linear-gradient(#34b95a,#1f8f43);
  animation:nsMuc .9s ease-out both}
.ns-wrap .ns-sh-vach{position:absolute; left:22px; width:156px; bottom:90px; border-top:2px dashed #ca8a04}
.ns-wrap .ns-sh-vachchu{margin-top:4px; font-size:11px; font-weight:700; line-height:1.3; color:#ca8a04; text-align:center}
/* Ô chữ VỪA KHÍT chữ, căn giữa (anh 18/09: ô rộng cả thùng che mất vạch cam) ⇒ vạch lộ hai bên mà không gạch ngang chữ. */
.ns-wrap .ns-sh-chu{position:absolute; left:50%; transform:translateX(-50%); width:max-content; max-width:150px; padding:2px 6px;
  border-radius:6px; background:rgba(255,255,255,.88)}
.ns-wrap .ns-sh-tren{top:30%}
.ns-wrap .ns-sh-giua{top:50%}
.ns-wrap .ns-sh-duoi{bottom:32px}
@media (prefers-reduced-motion:reduce){
  .ns-wrap .ns-can-don, .ns-wrap .ns-can-dia, .ns-wrap .ns-sh-nuoc{animation:none}
}
/* Khung trái 4fr hẹp ⇒ màn < 1300px đồng hồ kim đầu tư + cột chữ xếp TRÊN DƯỚI, khỏi bóp chữ (soat-loi 18/09, anh gật ~22:40). */
@media (max-width:1300px){
  .ns-wrap .ns-dk-kimdt{flex-direction:column; align-items:center}
}
@media (max-width:900px){
  .ns-wrap .ns-dk-hai{grid-template-columns:1fr}
  .ns-wrap .ns-dk-4the{grid-template-columns:repeat(2, minmax(0,1fr))}
  .ns-wrap .ns-dk-pt{flex-direction:column; align-items:stretch}
  .ns-wrap .ns-dk-kimdt{flex-direction:column; align-items:center}
}
/* ---- NS-2 GĐ4 nhịp 4C — biểu đồ thu chi theo tháng + nút/hộp Mục tiêu ----
   Biểu đồ vẽ bằng khối HTML (chữ sắc, co theo bề ngang, chế độ tối ăn biến màu). Màu cột = đúng mã trang thầy (đo 18/09):
   thu #28A745 · chi rgb(220,53,69); cột chi HẸP HƠN và ĐÈ lên cùng chỗ: thu 72 % ô (Chart.js mặc định .8 × .9) · chi 45 % ô
   (thầy đặt categoryPercentage .5 × .9) — tức cột chi ≈ 62 % bề ngang cột thu. */
.ns-wrap .nut.ns-nut-mt{background:var(--cool); border-color:var(--cool); color:#fff}
.ns-wrap .ns-bd-dau{display:flex; justify-content:space-between; align-items:center; gap:12px; text-align:left}
.ns-wrap .ns-bd-chu{display:flex; justify-content:center; gap:18px; font-size:13px; color:var(--dim)}
.ns-wrap .ns-bd-chu span{display:inline-flex; align-items:center; gap:6px}
.ns-wrap .ns-bd-o{display:inline-block; width:22px; height:10px; border-radius:2px}
.ns-wrap .ns-bd-o-thu, .ns-wrap .ns-bd-thu{background:#28A745}
.ns-wrap .ns-bd-o-chi, .ns-wrap .ns-bd-chi{background:rgb(220,53,69)}
.ns-wrap .ns-bd-ve{position:relative; height:320px; margin-left:74px}
.ns-wrap .ns-bd-luoi{position:absolute; left:0; right:0; top:0; bottom:22px; border-bottom:1px solid var(--line)}
.ns-wrap .ns-bd-vach{position:absolute; left:0; right:0; border-top:1px dashed var(--line-soft)}
.ns-wrap .ns-bd-vach span{position:absolute; right:100%; margin-right:8px; transform:translateY(-50%); font-size:12px;
  color:var(--dim2); white-space:nowrap; font-variant-numeric:tabular-nums}
.ns-wrap .ns-bd-hang{position:absolute; inset:0; display:flex}
.ns-wrap .ns-bd-cot{flex:1; min-width:0; display:flex; flex-direction:column}
.ns-wrap .ns-bd-vung{position:relative; flex:1}
.ns-wrap .ns-bd-thu, .ns-wrap .ns-bd-chi{position:absolute; bottom:0; left:50%; transform:translateX(-50%); border-radius:3px 3px 0 0}
.ns-wrap .ns-bd-thu{width:72%}
.ns-wrap .ns-bd-chi{width:45%}
.ns-wrap .ns-bd-cot:hover .ns-bd-vung{background:var(--line-soft)}
.ns-wrap .ns-bd-nhan{height:22px; line-height:22px; text-align:center; font-size:12.5px; color:var(--dim)}
.ns-wrap .ns-bd-tong .ns-bd-nhan{font-weight:700; color:var(--txt)}
.ns-wrap .ns-bd-cot.ns-tuonglai .ns-bd-nhan{color:var(--dim2); opacity:.55}
.ns-wrap .ns-bd-rong{position:absolute; left:0; right:0; top:40%; text-align:center; font-size:13.5px; color:var(--dim)}
/* Công tắc tròn (khuôn `#trChanDoan .cd-pb-lbl` — chép, scope chặt trong .ns-gat): "Thang log" + cột "Đã đạt". */
.ns-wrap .ns-gat, #ghiChuNen .ns-gat{display:inline-flex; align-items:center; gap:8px; cursor:pointer; font-size:13.5px; font-weight:400; color:var(--dim)}
.ns-wrap .ns-gat input[type="checkbox"], #ghiChuNen .ns-gat input[type="checkbox"]{appearance:none; -webkit-appearance:none;
  width:30px; height:16px; border-radius:999px; background:var(--line); position:relative; cursor:pointer; margin:0; flex:0 0 auto; transition:background .15s}
.ns-wrap .ns-gat input[type="checkbox"]:focus-visible, #ghiChuNen .ns-gat input[type="checkbox"]:focus-visible{outline:2px solid var(--cool); outline-offset:2px}
.ns-wrap .ns-gat input[type="checkbox"]::before, #ghiChuNen .ns-gat input[type="checkbox"]::before{content:""; position:absolute;
  top:2px; left:2px; width:12px; height:12px; border-radius:50%; background:#fff; box-shadow:0 1px 2px rgba(0,0,0,.25); transition:left .15s}
.ns-wrap .ns-gat input[type="checkbox"]:checked, #ghiChuNen .ns-gat input[type="checkbox"]:checked{background:var(--cool)}
.ns-wrap .ns-gat input[type="checkbox"]:checked::before, #ghiChuNen .ns-gat input[type="checkbox"]:checked::before{left:16px}
#ghiChuNen .ns-gat input[type="checkbox"]:disabled{opacity:.5; cursor:default}
/* Hộp Mục tiêu RỘNG (bảng 10 cột y thầy) — đặt SAU luật 600px của `.ns-hop` (cùng độ ưu tiên, luật sau thắng). */
#ghiChuNen .hop:has(.ns-hop-mt){max-width:min(1120px, 94vw)}
#ghiChuNen .ns-mt-form{display:flex; flex-wrap:wrap; align-items:flex-end; gap:10px}
#ghiChuNen .ns-mt-form .o-nhap{margin:0}
#ghiChuNen .ns-mt-o-ten{flex:3 1 220px} #ghiChuNen .ns-mt-o-so{flex:0 1 90px}
#ghiChuNen .ns-mt-o-tien{flex:1 1 140px} #ghiChuNen .ns-mt-o-han{flex:1 1 150px}
#ghiChuNen .ns-mt-nutform{display:flex; gap:8px}
#ghiChuNen .ns-mt-hang{display:flex; align-items:center; flex-wrap:wrap; gap:10px}
#ghiChuNen .ns-mt-loc{display:inline-flex; align-items:center; gap:6px; font-size:13.5px; color:var(--dim); cursor:pointer; margin-right:auto}
#ghiChuNen .ns-mt-bang td.p, #ghiChuNen .ns-mt-bang th.p{text-align:right; white-space:nowrap}
#ghiChuNen .ns-mt-dong{cursor:pointer}
#ghiChuNen .ns-mt-dong:hover td{background:var(--line-soft)}
#ghiChuNen .ns-mt-dong.dang td{background:var(--cool-soft)}
#ghiChuNen .ns-mt-dong.ns-xoa .ns-mt-cten{text-decoration:line-through}
#ghiChuNen .ns-mt-cpct{min-width:170px; text-align:center}
#ghiChuNen .ns-mt-thanh{height:8px; border-radius:999px; background:var(--line-soft); overflow:hidden}
#ghiChuNen .ns-mt-thanh i{display:block; height:100%; background:var(--cool)}
#ghiChuNen .ns-mt-thanh.ns-mt-dat i{background:var(--up)}
#ghiChuNen .ns-mt-phan{margin-top:3px; font-size:12px; color:var(--dim); white-space:nowrap}
#ghiChuNen .ns-mt-rong{text-align:center; color:var(--dim); padding:14px 6px}
#ghiChuNen .ns-mt-rut{width:16px; height:16px; cursor:pointer}
#ghiChuNen .ns-bao{padding:8px 12px; border-radius:9px; font-size:13.5px}
#ghiChuNen .ns-bao-cho{background:var(--cool-soft); color:var(--cool)}
#ghiChuNen .ns-xanh{color:var(--up)}
#ghiChuNen .ns-dk-nho{font-size:13px; color:var(--dim)}
@media (max-width:900px){
  .ns-wrap .ns-bd-ve{margin-left:56px; height:260px}
  .ns-wrap .ns-bd-nhan{font-size:11px}
}
/* ⚠️ ĐẶT CUỐI — cùng bẫy `[hidden]` thua luật `display` đã vấp 3 lần ở tab Tái cân bằng (khối trên). */
.ns-wrap [hidden], #ghiChuNen .ns-hop [hidden]{display:none}

/* ═══════════ (#68) CỔNG ĐĂNG NHẬP — làn 4B nhịp A2 · index.html `#dnNen` · dây nối nav.js #13 ═══════════
   Nền ĐỤC phủ kín trang (không mờ — mờ vẫn lộ bóng bảng số). z-index 1000: cao hơn mọi hộp nổi của trang
   (hộp toàn màn hình đang dùng 60–71). Chỉ mượn biến có sẵn ⇒ tự theo chế độ sáng/tối. */
/* (#121) BỐ CỤC KIỂU COINTRACKING (anh duyệt mẫu Mockups/mockup-dang-nhap-kieu-cointracking-v1.html 22:48 05/10): thanh trên `.dn-top` ·
   thân hai cột `.dn-than` (chữ chào `.dn-chao` trái, thẻ `.dn-hop` phải), màn hẹp xếp một cột. Rộng hết bề ngang, KHÔNG bó max-width cả trang.
   (#123) MÀU NHẤN VỀ XANH LAM (anh đổi ý 23:46 05/10, chọn mẫu …-ban-xanh-v1.html): bỏ dòng khai lại `--cool` màu đen của #121 ⇒ nút + dòng bấm
      trong cổng dùng đúng `--cool` của cả trang, sáng / tối tự theo. `--dn-on` = màu chữ trên nút (trắng ở cả hai chế độ). */
.dn-nen{position:fixed; inset:0; z-index:1000; background:var(--ink); overflow:auto;
  display:flex; flex-direction:column; color:var(--txt); font-family:var(--font); --dn-on:#fff}
.dn-top{display:flex; align-items:center; justify-content:space-between; gap:12px; padding:16px 40px}
.dn-top-nut{display:flex; align-items:center; gap:14px}
.dn-theme{all:unset; cursor:pointer; font-size:18px; line-height:1; color:var(--dim); padding:4px 6px}
.dn-theme::before{content:"☾"}
[data-theme="dark"] .dn-theme::before{content:"☀"}
.dn-than{flex:1; display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); gap:48px; align-items:center;
  padding:32px 8% 56px; box-sizing:border-box}
.dn-chao-tieu{margin:0; font-size:46px; font-weight:800; line-height:1.15; letter-spacing:-.02em; color:var(--txt)}
.dn-chao-tieu > span{display:block}   /* (#123) chỉ con trực tiếp: chữ "Vàng" `.brand-gold` lồng bên trong phải nằm cùng dòng */
.dn-chao-duoi{margin:18px 0 0; font-size:17px; line-height:1.6; color:var(--dim); max-width:34em}
.dn-chao .dn-chip{margin-top:22px; gap:8px}
.dn-hop{width:100%; max-width:560px; justify-self:center; box-sizing:border-box; background:var(--panel); border:1px solid var(--line);
  border-radius:var(--r); box-shadow:var(--shadow); padding:36px 36px 30px; color:var(--txt); font-family:var(--font)}
/* (#123) Cụm tên ở cổng đăng nhập = y cụm tên thanh trên (ảnh + "Chu Kỳ" + "Vàng" vàng kim + dòng nhỏ). */
.dn-logo{display:flex; align-items:center; gap:12px; min-width:0; font-weight:800; font-size:26px; line-height:1.1; letter-spacing:-.01em; color:var(--txt); white-space:nowrap}
.dn-logo img{width:44px; height:44px; border-radius:11px; flex:none; object-fit:cover}
.dn-logo small{display:block; margin-top:2px; font-weight:400; font-size:13.5px; color:var(--txt); letter-spacing:0}
.dn-man{display:flex; flex-direction:column; gap:12px}
.dn-tieu{margin:0; font-size:20px; line-height:1.3}
.dn-duoi{margin:0; color:var(--dim); font-size:14px; line-height:1.5}
.dn-ghi{margin:0; color:var(--dim); font-size:13.5px; text-align:center}
.dn-chip{display:flex; flex-wrap:wrap; gap:6px}
.dn-chip span{font-size:13px; padding:4px 10px; border-radius:999px; background:var(--line-soft); color:var(--dim)}
.dn-nut-hang{display:flex; gap:10px; flex-wrap:wrap}
.dn-nut{all:unset; box-sizing:border-box; cursor:pointer; text-align:center; font-weight:600; font-size:14px;
  padding:10px 18px; border-radius:10px; background:var(--cool); color:#fff}
.dn-nut.phu{background:transparent; color:var(--cool); border:1px solid var(--cool)}
.dn-nut.rong{width:100%}
.dn-nut:disabled{opacity:.55; cursor:progress}
.dn-nut:focus-visible, .dn-lui:focus-visible{outline:2px solid var(--cool); outline-offset:2px}
.dn-lui{all:unset; cursor:pointer; align-self:center; font-size:13.5px; color:var(--dim)}
.dn-lui:hover{color:var(--txt)}
.dn-o{display:flex; flex-direction:column; gap:6px; font-size:13.5px; font-weight:600}
.dn-o input, .dn-o textarea, .dn-sau{font:inherit; font-weight:400; font-size:15px; color:var(--txt);
  background:var(--panel); border:1px solid var(--line); border-radius:10px; padding:10px 12px; width:100%; box-sizing:border-box}
.dn-o textarea{resize:vertical; min-height:64px}
.dn-o input:focus, .dn-o textarea:focus, .dn-sau:focus{outline:none; border-color:var(--cool)}
.dn-o-ghi{font-weight:400; font-size:13px; color:var(--dim)}
.dn-sau{text-align:center; letter-spacing:.4em; font-family:var(--mono); font-size:22px}
.dn-tick{display:flex; gap:8px; align-items:flex-start; font-size:13.5px; color:var(--dim)}
.dn-loi{margin:0; font-size:13.5px; color:var(--down); background:var(--down-soft); padding:8px 10px; border-radius:8px}
.dn-ts{min-height:65px}
.dn-giua{text-align:center; align-items:center}
.dn-thu{font-size:42px; line-height:1}
/* (#121) Nút + ô nhập RIÊNG trong cổng đăng nhập (bọc `.dn-nen` — `.dn-nut` còn dùng ở Quản trị / dải lỗi máy, không đổi ở đó). */
.dn-nen .dn-nut{color:var(--dn-on)}
.dn-nen .dn-nut.phu{background:var(--panel); color:var(--txt); border:1px solid var(--line)}
.dn-nen .dn-nut.rong{padding:14px 18px; font-size:15px}
.dn-nen .dn-o input, .dn-nen .dn-o textarea{padding:15px 14px}
.dn-nen .dn-o input::placeholder, .dn-nen .dn-o textarea::placeholder{color:var(--dim); opacity:1}
/* Tên ô ẩn khỏi mắt (chữ mờ trong ô thay), máy đọc màn hình vẫn đọc. */
.dn-o-an > span:first-child{position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap}
.dn-mk{position:relative}
.dn-nen .dn-mk .dn-o input{padding-right:46px}   /* phải thắng luật lề ô ở trên, kẻo chữ chui dưới nút 👁 */
.dn-mat{all:unset; position:absolute; right:10px; top:50%; transform:translateY(-50%); cursor:pointer; padding:4px 6px;
  font-size:16px; line-height:1; color:var(--dim); opacity:.7}
.dn-mat[aria-pressed="true"]{opacity:1}
.dn-chan{font-size:14px}
.dn-lien.dn-lien-giua{align-self:center; font-size:14px}   /* hai lớp: phải thắng `all:unset` của `.dn-lien` khai bên dưới */
.dn-nen .dn-tick input{accent-color:var(--cool)}
/* Màn mã 6 số: nhãn trên ô + chữ mờ "Mã 6 số" (chữ mờ KHÔNG giãn cách, không phông số như mã thật). */
.dn-nhan{font-size:15px; color:var(--txt)}
.dn-nen .dn-sau{padding:15px 14px}
.dn-sau::placeholder{letter-spacing:0; font-family:var(--font); font-size:15px; color:var(--dim); opacity:1}
.dn-lien{all:unset; cursor:pointer; color:var(--cool); font-weight:600}   /* (#123) xanh lam, không gạch chân — rê chuột mới gạch */
.dn-lien:hover{text-decoration:underline}
.dn-mat:focus-visible, .dn-lien:focus-visible, .dn-theme:focus-visible{outline:2px solid var(--cool); outline-offset:2px}
/* Theo màn (`#dnNen[data-man]`, nav.js `moMan` ghi): câu chào + nút góc phải đổi; màn chờ / lỗi máy / link mời chỉ còn thẻ. */
.dn-chao-tk, #dnTopTaoTK, #dnTopDangNhap{display:none}
.dn-nen[data-man="taotk"] .dn-chao-tk, .dn-nen[data-man="danhan"] .dn-chao-tk{display:block}
.dn-nen[data-man="taotk"] .dn-chao-dn, .dn-nen[data-man="danhan"] .dn-chao-dn{display:none}
.dn-nen[data-man="dangnhap"] #dnTopTaoTK, .dn-nen[data-man="ma"] #dnTopTaoTK{display:inline-block}
.dn-nen[data-man="taotk"] #dnTopDangNhap, .dn-nen[data-man="danhan"] #dnTopDangNhap{display:inline-block}
.dn-nen[data-man="cho"] .dn-chao, .dn-nen[data-man="loimay"] .dn-chao,
.dn-nen[data-man="loimoi"] .dn-chao, .dn-nen[data-man="lmxong"] .dn-chao{display:none}
.dn-nen[data-man="cho"] .dn-than, .dn-nen[data-man="loimay"] .dn-than,
.dn-nen[data-man="loimoi"] .dn-than, .dn-nen[data-man="lmxong"] .dn-than{grid-template-columns:minmax(0,1fr); align-items:start; align-content:start}
@media (max-width:860px){
  .dn-top{padding:14px 16px}
  .dn-logo{font-size:20px; gap:9px}
  .dn-logo img{width:34px; height:34px; border-radius:9px}
  .dn-logo small{display:none}
  .dn-than{grid-template-columns:minmax(0,1fr); gap:22px; padding:12px 16px 32px; align-items:start; align-content:start}
  .dn-chao-tieu{font-size:30px}
  .dn-chao-duoi{font-size:15px; margin-top:10px}
  .dn-chao .dn-chip{display:none}
  .dn-hop{padding:22px 18px}
  /* (#136/#137) màn hẹp: bỏ cả hai nút góc "Tạo tài khoản" / "Đăng nhập" (anh duyệt 18/10) — cùng độ ưu tiên với luật hiện theo màn ở trên, đứng sau nên thắng */
  .dn-nen[data-man] #dnTopTaoTK, .dn-nen[data-man] #dnTopDangNhap{display:none}
}
/* (#125) ĐĂNG NHẬP BẰNG GOOGLE (mẫu anh duyệt Mockups/mockup-dang-nhap-google-v1.html; index.html #277 · nav.js #40). Chỉ mượn biến có sẵn ⇒ tự theo sáng / tối.
   Thẻ `.dn-hop` + ô lỗi `.dn-loi` đã góc vuông từ khối luật góc vuông 05/10 phía dưới tệp — ở đây KHÔNG khai lại. Nút bấm giữ bo. */
/* Dòng "hoặc" ngăn hai cách đăng nhập. */
.dn-or{display:flex; align-items:center; gap:12px; margin:2px 0; font-size:13.5px; color:var(--dim)}
.dn-or::before, .dn-or::after{content:""; flex:1; height:1px; background:var(--line)}
/* (#136) Nút Google kiểu chuẩn "Đăng nhập bằng Google" (anh duyệt ảnh mẫu 18/10): nền trắng, viền xám mảnh, chữ xám đậm vừa — giữ trắng cả nền tối
   (y nút chuẩn của Google). Vẫn nhẹ hơn nút chính để nút "Đăng nhập" / "Gửi đơn" là nút nổi nhất. */
.dn-google{all:unset; box-sizing:border-box; cursor:pointer; width:100%; display:flex; align-items:center; justify-content:center; gap:12px;
  padding:11px 18px; border-radius:10px; border:1px solid #dadce0; background:#fff; color:#3c4043; font-weight:500; font-size:15px}
.dn-google:hover{background:#f8faff; border-color:#d2e3fc}
.dn-google:focus-visible{outline:2px solid var(--cool); outline-offset:2px}
/* (#136) Logo G 4 màu = SVG dán thẳng trong index.html — KHÔNG tải ảnh từ máy Google. */
.dn-google-mark{flex:none; width:18px; height:18px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center}
.dn-google-mark svg{display:block; width:18px; height:18px}
.dn-google-note{margin:0; font-size:13.5px; line-height:1.5; color:var(--dim); text-align:center}
/* Khung báo "Google đã xác nhận email …" ở màn mã 6 số và màn đã nhận đơn: thanh dọc bên trái, góc vuông. */
.dn-google-ok{margin:0; font-size:13.5px; line-height:1.5; color:var(--txt); background:var(--line-soft); border-left:3px solid var(--cool); padding:8px 10px; text-align:left}
.dn-google-ok b{overflow-wrap:anywhere}   /* email dài không đẩy tràn thẻ ở màn 390px */
.dn-google-next{display:flex; flex-direction:column; gap:12px}
/* Dòng dưới thẻ cổng: link trang chính sách riêng tư + email liên hệ — người chưa đăng nhập cũng thấy. Cỡ chữ = dòng chân trang. */
.dn-foot{padding:0 16px 20px; font-size:12px; color:var(--dim2); text-align:center}
.dn-foot a{color:var(--dim); text-decoration:underline; text-underline-offset:3px}
.dn-foot a:hover, .dn-foot a:focus-visible{color:var(--txt)}
/* ⚠️ ĐẶT CUỐI KHỐI — `.dn-man`/`.dn-nen` có `display:flex`, không có dòng này là `hidden` bị đè, 5 màn hiện cùng lúc. */
.dn-nen[hidden], #dnNen [hidden]{display:none !important}

/* ═══ (#69) LÀN 4B NHỊP A3a — menu 👤 thêm 3 dòng + màn "Tài khoản của tôi" + che số tiền + giấu theo quyền ═══
   Nút DÙNG LẠI `.dn-nut` / `.dn-nut.phu` của cổng đăng nhập; ô gõ mượn đúng bộ thuộc tính `.dn-o input`.
   Chỉ mượn biến có sẵn, KHÔNG đẻ biến mới ⇒ tự theo chế độ sáng/tối. */
.tk-dong input[type="checkbox"]{width:16px; height:16px; accent-color:var(--cool); cursor:pointer}
.tk-trang{max-width:640px}
.tk-trang h2{margin:8px 0 6px}
.tk-phu{margin:4px 0 10px; font-size:13.5px; color:var(--dim)}
.tk-khoi{border:1px solid var(--line); border-radius:12px; padding:14px 16px; margin:14px 0; background:var(--panel)}
.tk-khoi h3{margin:0 0 6px; font-size:15px}
.tk-khoi form{display:flex; flex-direction:column; gap:10px}
.tk-khoi label{display:flex; flex-direction:column; gap:4px; font-size:13.5px; color:var(--txt)}
.tk-khoi input[type="password"], .tk-khoi input[type="text"]{font:inherit; font-weight:400; font-size:15px; color:var(--txt);
  background:var(--panel); border:1px solid var(--line); border-radius:10px; padding:10px 12px; width:100%; box-sizing:border-box}
.tk-khoi .tk-gat{flex-direction:row; align-items:flex-start; gap:10px; cursor:pointer}
.tk-ok{margin:0; font-size:13.5px; color:var(--up); padding:8px 10px; border-radius:8px; border:1px solid var(--up)}
.tk-qr{width:180px; height:180px; background:#fff; padding:8px; border-radius:8px; align-self:flex-start}
.tk-ds-ma{columns:2; font-family:ui-monospace,Consolas,monospace; font-size:16px; letter-spacing:.5px; margin:6px 0 12px; padding-left:22px}
/* Quyền `ppl` = false (máy chủ nói người này không được xem Phương pháp luận) ⇒ giấu link + mọi nút (?)
   + khung ghi chú chung. ⚠️ Chỉ là GIẤU trên trang — khoá thật là cửa /ppl phía máy chủ. */
body.khong-ppl a[href^="phuongphapluan.html"],
body.khong-ppl .cd-hoi, body.khong-ppl .tf-cd-hoi, body.khong-ppl .ns-hoi, body.khong-ppl .nhan-hoi,
body.khong-ppl .o-hoi, body.khong-ppl .tf-gio-hoi, body.khong-ppl .tf-tong-hoi, body.khong-ppl #ghiChuNen{display:none !important}
/* Tách riêng: mọi luật `.tcb-*` phải khoá trong `#trTaiCanBang` (bài kiểm test_tcb_gd2a ca ⑯). */
#trTaiCanBang .tcb-hoi:is(body.khong-ppl *){display:none !important}
/* In mã dự phòng: chỉ in đúng khối mã, giấu mọi thứ khác. */
@media print{
  body.in-ma-du-phong *{visibility:hidden}
  body.in-ma-du-phong #tkKhoiMaMoi, body.in-ma-du-phong #tkKhoiMaMoi *{visibility:visible}
  body.in-ma-du-phong #tkKhoiMaMoi{position:absolute; left:0; top:0; border:0}
  /* Chế độ tối: chữ đang màu sáng, máy in bỏ nền ⇒ ép chữ đen nền trắng, không là in ra giấy trắng trơn. */
  body.in-ma-du-phong #tkKhoiMaMoi, body.in-ma-du-phong #tkKhoiMaMoi *{color:#000 !important; background:#fff !important}
  body.in-ma-du-phong #tkKhoiMaMoi button{display:none}
}
/* ⚠️ ĐẶT CUỐI KHỐI — `.tk-dong` là `display:flex`, form trong `.tk-khoi` cũng flex ⇒ không có dòng này thì `hidden` bị đè. */
.tk-dong[hidden], .tk-khoi[hidden], .tk-khoi form[hidden], .tk-khoi label[hidden], #trTaiKhoan [hidden]{display:none !important}

/* ═══ (#70) LÀN 4B NHỊP A4 — màn "Quản trị" (`#trQuanTri`, index.html #168) ═══
   Khung + nút DÙNG LẠI `.tk-khoi` / `.dn-nut`. Chỉ mượn biến có sẵn, KHÔNG đẻ biến mới ⇒ tự theo sáng/tối.
   ⚠️ Luật toàn cục `table{min-width:900px}` ép bảng tràn ngang ⇒ bảng ở đây đè `min-width:0` + bọc `.qt-cuon` cuộn ngang. */
.qt-trang{max-width:1000px}
/* (#79, anh chốt 26/09) Trang Quản trị giãn hết bề ngang — khuôn `#trGiaodich .wrap` (luật "trang co giãn", 24/09). */
#trQuanTri .wrap{max-width:none}
/* …và khung ngoài `.noidung` của màn riêng (bó 1100px ở khối #71) cũng thả ra — CHỈ khi đang mở Quản trị; Tài khoản giữ nguyên. */
body.man-rieng .noidung:has(> #trQuanTri.hien){max-width:none}
.qt-khoi-don{border-color:var(--gold)}
.qt-dem{color:var(--gold); font-weight:600}
.qt-cuon{overflow-x:auto; -webkit-overflow-scrolling:touch}
.qt-bang{min-width:0; margin:6px 0 4px}
.qt-bang td{padding:10px 12px}
.qt-bang .giua{text-align:center}
.qt-th-phu{font-weight:400; font-size:11.5px; text-transform:none; letter-spacing:0}
.qt-ai{display:block; font-size:13px; color:var(--dim)}
.qt-mo{color:var(--dim2)}
.qt-quyet{white-space:nowrap}
.qt-nut-nho{padding:6px 12px; font-size:13.5px; margin:2px 6px 2px 0}
.dn-nut.phu.qt-nut-do{color:var(--down); border-color:var(--down)}
.qt-duyet td{background:var(--line-soft)}
.qt-duyet select, #qtMoiVai{font:inherit; font-size:14px; color:var(--txt); background:var(--panel);
  border:1px solid var(--line); border-radius:8px; padding:6px 10px; margin:0 8px 0 4px}
.tk-khoi form.qt-hang{flex-direction:row; flex-wrap:wrap; align-items:flex-end; gap:12px}
.qt-hang .qt-o-email{flex:1 1 220px}
.qt-hang input[type="email"]{font:inherit; font-weight:400; font-size:15px; color:var(--txt); background:var(--panel);
  border:1px solid var(--line); border-radius:10px; padding:10px 12px; width:100%; box-sizing:border-box}
.qt-hang #qtMoiVai{margin:0; padding:10px 12px; border-radius:10px}
.qt-link{margin:10px 0 0}
.qt-link-hang{display:flex; gap:8px; margin-top:8px}
.tk-khoi .qt-link-hang input[type="text"]{flex:1; min-width:0; font-family:var(--mono); font-size:13.5px; color:var(--txt); background:var(--line-soft);
  border:1px solid var(--line); border-radius:8px; padding:8px 10px}
.qt-nho{font-size:13.5px; color:var(--dim2)}
/* Công tắc gạt: ô tích vẽ thành viên thuốc, vẫn là <input type=checkbox> ⇒ bấm phím cách được, đọc màn hình được. */
.qt-gat{appearance:none; -webkit-appearance:none; width:38px; height:22px; border-radius:999px; background:var(--line);
  position:relative; cursor:pointer; margin:0 auto; display:block; transition:background .15s}
.qt-gat::after{content:''; position:absolute; top:3px; left:3px; width:16px; height:16px; border-radius:50%;
  background:var(--panel); box-shadow:var(--shadow); transition:left .15s}
.qt-gat:checked{background:var(--up)}
.qt-gat:checked::after{left:19px}
.qt-gat:disabled{opacity:.45; cursor:not-allowed}
.qt-gat:focus-visible{outline:2px solid var(--cool); outline-offset:2px}
/* (#76) Ô đã gạt mà CHƯA LƯU: viền vàng quanh ô · hàng nút Lưu / Huỷ dưới bảng quyền. */
.qt-doi{box-shadow:inset 0 0 0 2px #f5a623; border-radius:8px}
.qt-luu{align-items:center; gap:10px; margin-top:12px}
.qt-hoi{margin-top:12px; font-size:13.5px; color:var(--dim); border-left:3px solid var(--gold); padding:8px 12px; background:var(--line-soft); border-radius:0 8px 8px 0}
/* ⚠️ ĐẶT CUỐI KHỐI — `.tk-khoi form` là flex ⇒ không có dòng này thì `hidden` bị đè. */
#trQuanTri [hidden]{display:none !important}

/* (#71) Màn Tài khoản / Quản trị CHIẾM TRỌN TRANG như trang thầy (nav.js #20 bật `body.man-rieng`):
   giấu tầng 2 + hàng tab, menu dọc `#tkBen` bên trái, khung màn bên phải. Ngoài màn riêng thì menu trái ẩn. */
.tk-ben{display:none}
body.man-rieng #tang2, body.man-rieng #hangTab{display:none}
body.man-rieng .noidung{display:grid; grid-template-columns:180px minmax(0,1fr); gap:24px; align-items:start;
  max-width:1100px; margin:24px auto 0; padding:0 16px}
body.man-rieng .noidung > .chan-trang{grid-column:1 / -1}
body.man-rieng .tk-ben{display:flex; flex-direction:column; gap:4px; position:sticky; top:calc(var(--t1-h) + 1px)}
.tk-ben a{padding:8px 12px; border-radius:8px; color:var(--dim); text-decoration:none; font-size:14px}
.tk-ben a:hover{background:var(--line-soft); color:inherit}
.tk-ben a[aria-current="page"]{color:var(--cool); background:var(--line-soft); font-weight:600}
.tk-ben a[hidden]{display:none}
@media (max-width:720px){
  body.man-rieng .noidung{grid-template-columns:1fr; gap:8px}
  body.man-rieng .tk-ben{position:static; flex-direction:row; flex-wrap:wrap}
}
/* (31/10/2026, anh dặn) Cả ba màn riêng (Tài khoản · Quản trị · Cài đặt quỹ) chung một menu trái HẸP: cột vừa khít chữ dài nhất
   ("Tài khoản của tôi"), chữ không xuống dòng (bản 120px cứng làm chữ gãy hai dòng — anh chụp), khoảng cách menu ↔ nội dung 24 → 12px.
   Chỉ máy tính — dưới 721px vẫn một cột như trên. */
@media (min-width:721px){
  body.man-rieng .noidung{grid-template-columns:max-content minmax(0,1fr); column-gap:12px}
  body.man-rieng .tk-ben a{white-space:nowrap}
}
/* (#72) TRANG NHÚNG trong trang chính (nav.js #21 bật `body.man-trang`, hiện có: Phương pháp luận `#trPpl`) — giấu tầng 2 +
   hàng tab + chân trang, khung chiếm trọn phần dưới thanh trên. Trang về sau (Quỹ…) gắn vào cùng khuôn này. */
/* (đổi ở #118) Dòng chân `.chan-trang` THÔI bị giấu ở trang nhúng: anh muốn Quỹ và Thư viện cũng có dòng số bản + "Nguồn gốc chỉ số" + câu miễn trừ. */
body.man-trang #tang2, body.man-trang #hangTab{display:none}
/* Riêng trang Phương pháp luận của NHÀ CŨ (`#trPpl`, khung `#pplKhung` cao đúng phần dưới thanh trên) vẫn giấu chân: hiện thì trang mọc thanh cuộn thứ hai cạnh thanh cuộn của khung. */
body.man-trang .noidung:has(> #trPpl.hien) > .chan-trang{display:none}
#pplKhung{display:block; width:100%; height:calc(100vh - var(--t1-h)); border:0; background:var(--ink)}
/* (#73) Dải báo lỗi máy chủ (index.html #173 `#loiMayDai`, nav.js #22 bật). Chỉ mượn biến có sẵn ⇒ tự theo sáng/tối.
   Nằm theo luồng trang ở trên thanh trên, KHÔNG dính (soát lỗi: dính top:0 z-index cao thì đè thanh `.t1` + đầu các
   hộp nổi, và các khung tính cao theo --t1-h bị lố); nút dùng lại `.dn-nut`. */
.loi-may-dai{display:flex; align-items:center; justify-content:center; gap:12px;
  flex-wrap:wrap; padding:8px 16px; background:var(--down-soft); color:var(--down); border-bottom:1px solid var(--down);
  font-size:14px; font-weight:600}
.loi-may-dai .dn-nut{padding:6px 14px; font-size:13.5px}
.loi-may-dai[hidden]{display:none}
/* (#74) Câu lịch sự khi không quyền xem Phương pháp luận (index.html #174 `#pplCam`, nav.js #23 bật). */
.ppl-cam{max-width:560px; margin:48px auto; padding:0 16px; text-align:center; color:var(--dim); font-size:15px; line-height:1.6}
.ppl-cam[hidden]{display:none}
/* (#75) TRANG QUỸ (việc 8B·7b-1 — index.html #177 `#trQuy`, donviquy.js #1). Chỉ THÊM lớp `quy-`, không sửa luật cũ.
   Các con số dưới CHÉP ĐÚNG khu tầng 2 trang Chỉ số (khối `:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac)` — lưới 2 cột gap 22px,
   bảng chữ 12px ô 8/9 · 7/9, dòng chọn nền `--cool-soft` vạch trái, nến cao 460px) để hai trang nhìn như một.
   ⚠️ Vì sao chép chứ không thêm `#trQuy` vào ~306 bộ chọn `:is(...)` như lần mở tab Dữ liệu thị trường (#64): bảng
      anh duyệt cho 8B·7b-1 chỉ cho THÊM lớp `quy-`. Muốn "đổi một chỗ là đổi hai trang" thì làm một việc riêng: thêm
      `#trQuy` vào các `:is(...)` đó rồi xoá khối này. Còn dùng thẳng lớp chung sẵn có: `.card` `.bang` `.bd-sel` `.src`
      `.num` `.len/.xuong` `.hang-tab` `.donut-*`. */
#lnQuy[hidden]{display:none}
#trQuy [hidden]{display:none !important}
.quy-tang{display:grid; grid-template-columns:1fr 1fr; gap:22px; align-items:start; padding:0 20px}
.quy-khu{position:relative; min-width:0}
.quy-tt{font-size:13.5px; font-weight:700; letter-spacing:.02em; color:var(--txt);
  margin:0 0 10px; display:flex; align-items:baseline; gap:8px; flex-wrap:wrap}
.quy-tt small{font-size:12.5px; font-weight:500; color:var(--dim2); letter-spacing:0}
.quy-bang table{min-width:0; font-size:13px}
.quy-bang thead th{padding:8px 9px}
.quy-bang tbody td{padding:7px 9px}
.quy-bang td.p, .quy-bang th.p{text-align:right}
.quy-bang .mo-nhat{color:var(--dim2)}
.quy-stt{width:1%; white-space:nowrap; text-align:right; color:var(--dim2)}
.quy-ten b{font-weight:600}
.quy-ten small, .quy-bang td.p small{display:block; font-size:12px; color:var(--dim2); font-weight:400; letter-spacing:.02em}
.quy-cham{display:inline-block; width:9px; height:9px; border-radius:50%; margin-right:6px; vertical-align:middle}
.quy-bang tr.quy-dong{cursor:pointer}
.quy-bang tr.quy-dong:hover{background:var(--line-soft)}
.quy-bang tr.quy-dong.chon{background:var(--cool-soft)}
.quy-bang tr.quy-dong.chon td:first-child{box-shadow:inset 3px 0 0 var(--cool)}
.quy-bang tr.quy-nhom td{font-size:12px; font-weight:700; letter-spacing:.04em; color:var(--dim); background:var(--line-soft)}
.quy-chan{margin:8px 2px 0; font-size:12.5px; color:var(--dim2); line-height:1.5}
.quy-dau-nen{display:flex; align-items:center; gap:8px; padding:12px 16px 0; flex-wrap:wrap}
.quy-nut{all:unset; cursor:pointer; display:inline-flex; align-items:center; justify-content:center;
  min-width:30px; height:28px; padding:0 8px; border-radius:8px;
  border:1px solid var(--line); color:var(--dim); font-size:15px; transition:.15s}
.quy-nut:hover{color:var(--txt); border-color:var(--cool)}
/* Ô hai nút "Tiền tệ" / "G/R" của biểu đồ Quỹ (nút `.tf-leg` do CKV_VE.legendButtons dựng, kiểu dùng chung với trang Chỉ số). */
/* (#105) Hàng nút là DẢI CHÂN của thẻ biểu đồ: luôn hiện, cao cố định 45px + đường kẻ trên (thẳng hàng với chân bảng trái `#quyBangChan`),
   kể cả lúc không có nút nào (nguồn Giá 1 ĐVQ) ⇒ thẻ không đổi chiều cao khi đổi nguồn, trục thời gian không dính mép dưới. */
.quy-legend{display:flex; gap:6px; flex-wrap:wrap; align-items:center; min-height:45px; box-sizing:border-box; padding:6px 16px; border-top:1px solid var(--line)}
.quy-ohlc{display:flex; gap:14px; flex-wrap:wrap; font-size:13px; color:var(--dim); padding:8px 22px 0}
.quy-ohlc b{font-weight:600}
.quy-chart{height:460px; margin:6px 10px 0}
.quy-hang-tab{margin-top:18px}
.quy-than{padding:18px 20px 32px}
/* Câu xám (Quỹ chưa mở · đang tải · tab nhịp sau) và câu lỗi — KHÔNG đỏ cho "chưa mở" (anh chốt bảng 8B·7b-1). */
.quy-chu-mo{margin:14px 16px; font-size:13.5px; color:var(--dim); line-height:1.55}
.quy-loi{margin:14px 16px; font-size:13.5px; color:var(--down); line-height:1.55}
/* (#80) Dải báo đỏ "tỷ giá cũ — tạm khoá Góp/Rút" đầu trang Quỹ (`#quyBaoTyGia`, donviquy.js #5 bật / tắt). Cùng màu băng đỏ mẫu MOCKUP_DON_VI_QUY_V1. */
.quy-bao-do{background:var(--down-soft); color:var(--down); border-bottom:1px solid var(--down); padding:9px 20px; font-size:13.5px; font-weight:600; line-height:1.5}
@media (max-width:900px){ .quy-tang{grid-template-columns:1fr} }
@media (max-width:760px){ .quy-chart{height:360px} .quy-tang{padding:0 12px} .quy-than{padding:14px 12px 28px} }

/* (#77) 8B·7b-2 — tab Nhà đầu tư · Góp vốn · Rút vốn (donviquy.js #2). Chỉ mượn biến màu có sẵn. */
.quy-form{display:flex; flex-wrap:wrap; gap:10px 14px; align-items:flex-end; padding:14px 16px 0}
.quy-form label{display:flex; flex-direction:column; gap:4px; font-size:13px; color:var(--dim); min-width:170px}
.quy-form input, .quy-form select, .quy-ly-do textarea{font:inherit; font-size:13px; padding:6px 8px; border:1px solid var(--line);
  border-radius:6px; background:var(--panel); color:var(--txt)}
.quy-form .o-may{background:var(--line-soft); color:var(--txt); font-weight:600; text-align:right; cursor:default}
.quy-nut-chinh{font:inherit; font-size:13px; font-weight:600; padding:7px 14px; border-radius:6px; border:1px solid var(--cool);
  background:var(--cool); color:#fff; cursor:pointer}
.quy-nut-chinh:disabled{opacity:.5; cursor:not-allowed}
.quy-nut-nho{font:inherit; font-size:12px; padding:3px 9px; border-radius:5px; border:1px solid var(--line); background:transparent;
  color:var(--down); cursor:pointer}
.quy-bang tr.da-huy td{text-decoration:line-through; color:var(--dim2)}
.quy-ct{padding:0 16px 16px}
.quy-the-hang{display:flex; flex-wrap:wrap; gap:14px}
.quy-the{display:flex; justify-content:space-between; gap:10px; padding:6px 0; border-bottom:1px solid var(--line-soft); font-size:13px}
.quy-the span{color:var(--dim)}
.quy-tab-con{display:flex; gap:14px; margin:14px 0 6px; font-size:13px}
.quy-tab-con a{color:var(--dim); text-decoration:none; padding-bottom:3px}
.quy-tab-con a[aria-current]{color:var(--txt); font-weight:600; box-shadow:inset 0 -2px 0 var(--cool)}
.quy-hop{position:fixed; inset:0; z-index:1000; display:flex; align-items:center; justify-content:center; background:rgba(0,0,0,.45); padding:16px}
.quy-hop[hidden]{display:none}
.quy-hop-khung{background:var(--panel); color:var(--txt); border:1px solid var(--line); border-radius:10px; padding:18px 20px;
  width:100%; max-width:460px; font-size:13px}
.quy-hop-khung h4{margin:0 0 12px; font-size:14px}
.quy-xn-dong{display:flex; justify-content:space-between; gap:10px; padding:5px 0; border-bottom:1px solid var(--line-soft)}
.quy-xn-dong span{color:var(--dim)}
.quy-ly-do{display:flex; flex-direction:column; gap:4px; margin-top:10px; color:var(--dim)}
.quy-hop-nut{display:flex; justify-content:flex-end; gap:10px; margin-top:14px}
.quy-hop-nut button:not(.quy-nut-chinh){font:inherit; font-size:13px; padding:7px 14px; border-radius:6px; border:1px solid var(--line);
  background:transparent; color:var(--txt); cursor:pointer}
.quy-hop .quy-loi{margin:10px 0 0}

/* (#78) 8B·7b-3 — Hồ sơ · Dòng tiền · Cài đặt (donviquy.js #3). Chỉ mượn biến màu có sẵn. */
/* (#84) bỏ `#quyHangTab .quy-nut-cai` — nút ⚙ Cài đặt đã dời vào menu trái trang Quản trị (💼 Cài đặt quỹ). */
.quy-dt-the{padding:14px 16px 0}
.quy-dt-the .quy-the{flex:1 1 200px; flex-direction:column; gap:4px; border:1px solid var(--line); border-radius:8px; padding:10px 12px}
.quy-dt-the .quy-the b{font-size:15px}
.quy-sdt{display:flex; align-items:center; gap:8px; min-height:30px; color:var(--txt)}
.quy-nut-luu{color:var(--cool)}
.quy-bang tr.mo-nhat td{color:var(--dim2)}
/* Người đã tất toán (0 ĐVQ): mờ CẢ hàng, kể cả số xanh / đỏ và vòng mã — số chỉ còn là số lịch sử (anh chốt 27/09 20:52). */
.quy-bang tr.quy-dong.tat-toan{opacity:.55}
.quy-bang tr.quy-dong.tat-toan.chon{opacity:.8}
.quy-bang tr.quy-dong.tat-toan .quy-ten small{font-style:italic}
#trQuy [data-dt-muc]{padding-bottom:6px}
/* 26/09/2026: dòng ghi chú này chỉ để Cloudflare coi là tệp mới — lần đưa V183 trước bị nhãn sai loại tệp. */
/* (#81) Trang Quỹ đợt 2 (donviquy.js #6): tab Tổng quan — dòng cảnh báo · 6 ô số · bánh vòng + "Việc vừa làm gần đây";
   chi tiết Nhà đầu tư — hàng nút đầu + chữ nhỏ dưới nhãn thẻ số + ô 🔑 Quản lý quỹ. Chỉ THÊM. */
.quy-tq-canh{margin:0 0 12px; font-size:13.5px; color:var(--dim)}
.quy-tq-canh:empty{display:none}
.quy-tq-canh.quy-tq-canh-do{color:var(--down); font-weight:600}
.quy-tq-o{display:grid; grid-template-columns:repeat(auto-fit, minmax(210px, 1fr)); gap:10px; margin-bottom:18px}
.quy-tq-the{background:var(--panel); border:1px solid var(--line); border-radius:10px; padding:12px 14px; display:flex; flex-direction:column; gap:4px; min-width:0}
.quy-tq-the span{font-size:13px; color:var(--dim)}
.quy-tq-the b{font-size:18px; font-weight:700; font-variant-numeric:tabular-nums}
.quy-tq-the small{font-size:12.5px; color:var(--dim2)}
.quy-gd-dong{padding:6px 0; border-bottom:1px solid var(--line-soft); font-size:13.5px}
.quy-gd-dong small{color:var(--dim2)}
.quy-ndt-dau{display:flex; justify-content:space-between; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:8px}
.quy-ndt-nut{display:flex; gap:8px; flex-wrap:wrap}
.quy-the span small{display:block; font-size:12px; color:var(--dim2)}
.quy-the-ql{background:var(--cool-soft); padding:8px; border-radius:6px}
/* (#82) Nhãn nhỏ trong ô bảng Góp / Rút trang Quỹ — đợt 3. */
.quy-nhan-xam,.quy-nhan-xanh,.quy-nhan-do{display:inline-block; font-size:12px; padding:1px 7px; border-radius:10px; white-space:nowrap}
.quy-nhan-xam{background:var(--line); color:var(--dim2)}
.quy-nhan-xanh{background:var(--cool-soft); color:var(--up)}
.quy-nhan-do{color:var(--down); font-weight:600}
/* (#83) Dải chuông vàng: sổ tiết kiệm tới hạn, ngân hàng đã nhả — tới khi anh bấm "Đã kiểm" (đợt 4). */
.quy-bao-vang{background:var(--cool-soft); color:var(--txt); border-bottom:1px solid var(--gold); border-left:4px solid var(--gold); padding:9px 20px; font-size:13.5px; line-height:1.6}
.quy-bao-vang > div + div{margin-top:4px}
.quy-bao-vang .quy-nut-nho{margin-left:4px}
/* (#84) "Tài khoản của tôi" + "💼 Cài đặt quỹ" giãn hết bề ngang (anh chốt 26/09 22:40, luật trang co giãn 24/09) —
   cùng khuôn #trQuanTri ở khối #79: thả `.wrap`/`.tk-trang` và khung ngoài `.noidung` của màn riêng. */
#trTaiKhoan .wrap,#trCaiDatQuy .wrap{max-width:none}
body.man-rieng .noidung:has(> #trTaiKhoan.hien),body.man-rieng .noidung:has(> #trCaiDatQuy.hien){max-width:none}

/* (#85) Tab Chỉ số — hai thẻ "Chỉ số & Danh mục" | "Danh mục công khai" (giống My / Public Portfolios của thầy)
   + nút "＋ Tạo danh mục mới" dưới bảng #1. taifu.js #73. */
.tf-ck-the{display:inline-flex; gap:2px; vertical-align:middle}
.tf-ck-nut{all:unset; cursor:pointer; font-size:13.5px; font-weight:700; padding:3px 10px; border-radius:6px 6px 0 0;
  color:var(--dim); border:1px solid transparent; border-bottom:2px solid transparent}
.tf-ck-nut:hover{color:var(--txt)}
.tf-ck-nut.chon{color:var(--cool); border-bottom-color:var(--cool)}
.tf-ck-nut:focus-visible{outline:2px solid var(--cool); outline-offset:1px}
.tf-tao-dm-hang{margin:8px 0 0}
.tf-tao-dm[hidden]{display:none}
.tf-ck-khien{font-size:13px}
.tf-ck-trong{text-align:center; padding:18px 8px !important}

/* (đợt 7) Trang Quỹ — bù theo MOCKUP_DON_VI_QUY_V1 (donviquy.js đợt 7). Chỉ THÊM, lớp tiền tố `quy-`.
   ① Ô 24h / 1 tháng / 3 tháng / 1 năm hai dòng: số tiền đổi trên, % nhỏ dưới — % ăn màu xanh / đỏ của ô (đè màu xám
      chung của `.quy-bang td.p small`). */
.quy-bang td.quy-o2 small{color:inherit; font-size:11.5px; opacity:.85}
/*   Số tiền + " ₫" không được ngắt dòng giữa chừng (trang thật 27/09: cột hẹp đẩy ₫ xuống dòng riêng). % vẫn xuống dòng vì <small> là khối. */
.quy-bang td.num{white-space:nowrap}
/* ② Dòng đối tác: vòng tròn chữ tắt (mockup `.tron`); nền nhạt pha từ màu người do donviquy.js đặt inline. */
.quy-nguoi{display:flex; align-items:center; gap:8px; white-space:nowrap}
.quy-tron{width:28px; height:28px; border-radius:50%; display:grid; place-items:center; font-size:12px; font-weight:700;
  background:var(--cool-soft); color:var(--cool); flex:none}
/* ③ Biểu đồ Quỹ phóng to (⛶) — cùng bộ thuộc tính `#tfChartCard.tf-full`; khoá cuộn dùng lại `body.bd-noscroll`. */
#quyChartCard.quy-full{position:fixed; inset:16px; z-index:60; margin:0; max-width:none;
  box-shadow:0 20px 60px rgba(0,0,0,.35); overflow:auto; display:flex; flex-direction:column}
/* (#106) Thẻ là cột co giãn: biểu đồ ăn HẾT chỗ còn lại ⇒ hàng nút sát đáy thẻ (bản #105 trừ cứng 200px, đo trang thật còn dải trống
   ~44px dưới hàng nút); ô chữ `#quyChartTT` có chữ thì biểu đồ tự thấp lại, không tràn thẻ. Các hàng còn lại giữ nguyên cao. */
#quyChartCard.quy-full > *{flex:0 0 auto}
#quyChartCard.quy-full > .quy-chart{flex:1 1 0; height:auto; min-height:160px}
#quyChartTT:empty{display:none}
/* ④ Tổng quan: 6 ô xếp 3 cột × 2 hàng; màn hẹp 2 cột, rất hẹp 1 cột. */
.quy-tq-o{grid-template-columns:repeat(3, minmax(0, 1fr))}
@media (max-width:900px){ .quy-tq-o{grid-template-columns:repeat(2, minmax(0, 1fr))} }
@media (max-width:560px){ .quy-tq-o{grid-template-columns:1fr} }

/* (đợt 8) Trang Quỹ — bảng + chi tiết Nhà đầu tư theo MOCKUP_NHA_DAU_TU_V1 (donviquy.js đợt 8). Chỉ THÊM.
   ① Cột Tỷ trọng: thanh ngang (nền xám nhạt, phần đầy màu chữ đậm) + số % bên phải (mockup `.thanh`). */
.quy-thanh{display:flex; align-items:center; gap:8px; justify-content:flex-end}
.quy-thanh i{display:block; width:70px; height:5px; background:var(--line-soft); border-radius:3px; overflow:hidden; flex:none}
.quy-thanh i s{display:block; height:100%; background:var(--txt)}
.quy-tg-lech{margin:6px 0 10px; padding:8px 12px; border-left:4px solid var(--gold); background:color-mix(in srgb, var(--gold) 10%, transparent);
  font-size:13.5px; color:var(--txt)}
/* ④ Bánh vòng Quỹ có "Giá trị" (portfolio.js #34 tuy.giaTri): chú giải ghi ĐỦ tên + % + giá trị, được xuống dòng, không cắt "…". */
.dl-t.dl-du{white-space:normal; overflow:visible; text-overflow:clip}

/* (mẻ 9, #88) Trang Quỹ làm lại bố cục theo MOCKUP_QUY_V2 (donviquy.js #15 · index.html #196). Chỉ lớp tiền tố `quy-`.
   ① Khung trái tầng 2 ("Chỉ số & Thành viên") CAO BẰNG khung biểu đồ; 100 người vẫn không dài trang — cuộn TRONG khung,
      hàng tiêu đề đứng yên nhờ luật chung `.bang > table > thead > tr > th` (y trang Chỉ số). `contain:size` ⇒ bảng không
      đẩy hàng lưới cao thêm, hàng lưới cao theo khung biểu đồ bên phải. Màn hẹp (một cột) ⇒ cao 60 % màn hình. */
.quy-tang{align-items:stretch}
.quy-khu-trai{display:flex; flex-direction:column; min-height:0}
.quy-khu-trai > .quy-bang{flex:1 1 0; min-height:240px; contain:size; overflow:auto}
@media (max-width:900px){ .quy-khu-trai > .quy-bang{flex:none; height:60vh} }
/* ② Mã viết tắt: ô nhỏ nền nhạt màu người; mã máy GỢI Ý (chưa lưu) viền nét đứt. Vòng tròn to ở đầu chi tiết người. */
.quy-ma{display:inline-grid; place-items:center; min-width:30px; height:22px; padding:0 6px; border-radius:6px;
  background:var(--cool-soft); color:var(--cool); font-size:12px; font-weight:700; white-space:nowrap}
.quy-ma.goi-y{outline:1px dashed currentColor; outline-offset:-1px}
.quy-tron.quy-tron-lon{width:44px; height:44px; font-size:14px}
.quy-ndt-ten{font-size:18px; font-weight:700}
.quy-ndt-dau .quy-nguoi small{display:block; font-size:13px; color:var(--dim)}
.quy-ndt-bao{margin:0 0 10px}
.quy-nut-sua{color:var(--cool)}
/* ③ Tổng quan: hai bánh vòng NGANG HÀNG (màn hẹp chồng dọc) · bảng Thành viên · việc gần đây dưới cùng. */
.quy-hai-banh{display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:14px}
.quy-o-banh{min-width:0}
.quy-o-banh .donut-hop{width:auto; max-width:none}
.quy-khoi{margin-top:22px}
@media (max-width:1000px){ .quy-hai-banh{grid-template-columns:1fr} }   /* #89: mốc theo MOCKUP_QUY_V2 (1100 làm Chrome 1092px bị chồng) */
/* ③b Hệ 3 xô trang Quỹ (anh duyệt mockup 25/10/2026, chukyvang/Mockups/mockup-he-3-xo-trang-quy-v1.html) — chủ quỹ / Quản lý:
   cột trái 1/3 hai bánh vòng chồng dọc (bánh nhỏ, chú giải chỉ mã + %) · cột phải 2/3 cái cân Giữ / Đạn + xô LÃI ĐÃ TRẢ (lớp ns-* của tab Bảng điều khiển). */
.quy-buckets{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,2fr); gap:14px; align-items:stretch}
.quy-buckets-left{display:flex; flex-direction:column; gap:14px; min-width:0}
.quy-buckets-left > .ns-dk-khung{flex:1}
.quy-buckets .quy-o-banh .donut-hop{border:0; padding:0; background:none}
.quy-buckets .donut-svg{width:250px; height:auto}
.quy-buckets .donut-leg{flex:none; gap:5px; white-space:nowrap}
.quy-buckets .donut-body{justify-content:center}
.ns-wrap .quy-paid-bucket{margin-left:70px; margin-right:70px}   /* chừa chỗ nhãn phải xô Đạn + nhãn phải xô Lãi đã trả */
.ns-wrap .quy-paid-bucket .ns-sh-nuoc{background:linear-gradient(#34b95a,#1f8f43)}
.ns-wrap .quy-paid-goal{left:-62px; bottom:90px; transform:translateY(100%)}   /* chữ mục tiêu bên TRÁI, dưới vạch (giống ngăn Chỉ số) */
.ns-wrap .quy-paid-label{left:204px}
@media (max-width:1000px){ .quy-buckets{grid-template-columns:1fr} }
/* ④ Tab Nhà đầu tư: ô sửa tên · mã · % phí · trái Thành tích (9 ô) + dải "Nếu rút hết" gọn · phải Phân tích nắm giữ. */
.quy-sua{display:flex; flex-wrap:wrap; gap:10px 14px; align-items:flex-end; background:var(--cool-soft); border-radius:10px;
  padding:10px 12px; margin-bottom:12px}
.quy-sua label{display:flex; flex-direction:column; gap:4px; font-size:13px; color:var(--dim)}
.quy-sua input{font:inherit; font-size:13px; padding:5px 8px; border:1px solid var(--line); border-radius:6px; background:var(--panel); color:var(--txt)}
.quy-sua p{flex-basis:100%; margin:0}
.quy-sua p:empty{display:none}
.quy-sua .quy-sua-chu{font-size:12.5px; color:var(--dim2)}
.quy-nut-thoi{color:var(--txt); font-size:13px; padding:6px 12px}
.quy-ndt-hai{display:grid; grid-template-columns:minmax(0, 1.6fr) minmax(0, 1fr); gap:14px; align-items:start}
.quy-ndt-tt{background:color-mix(in srgb, var(--up) 9%, transparent); border-radius:12px; padding:12px}
.quy-ndt-tt .quy-tt small{color:var(--up); font-weight:700}
.quy-o-so-luoi{display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:8px}
.quy-o-so{background:var(--panel); border-radius:8px; padding:8px 10px; display:flex; flex-direction:column; gap:2px; min-width:0}
.quy-o-so span{font-size:12.5px; color:var(--dim)}
.quy-o-so b{font-size:16px; font-weight:700; white-space:nowrap}
.quy-o-so small{font-size:12px; color:var(--dim2)}
.quy-ndt-tt .quy-the-ql{margin-top:8px}
.quy-rut-gon{display:flex; flex-wrap:wrap; align-items:baseline; gap:6px 10px; margin-top:10px; border-radius:10px; padding:8px 12px;
  background:color-mix(in srgb, var(--gold) 12%, transparent); font-size:13.5px; color:var(--dim)}
.quy-rut-gon b{color:var(--txt); white-space:nowrap}
.quy-rut-gon b.quy-rg-tt{color:var(--gold); margin-right:4px}
.quy-rut-gon i{font-style:normal; color:var(--dim2)}
.quy-rut-gon .quy-rg-nhan b{font-size:15px}
.quy-pa{border:1px solid var(--line); border-radius:12px; padding:12px}
.quy-pa h5{margin:0 0 6px; font-size:13.5px}
.quy-pa > div{display:flex; justify-content:space-between; gap:8px; font-size:13.5px; padding:4px 0; border-bottom:1px dashed var(--line)}
.quy-pa > div:last-child{border-bottom:0}
.quy-pa span small{display:block; font-size:12px; color:var(--dim2)}
.quy-pa b{text-align:right; white-space:nowrap}
@media (max-width:1000px){ .quy-ndt-hai{grid-template-columns:1fr} }
@media (max-width:560px){ .quy-o-so-luoi{grid-template-columns:1fr 1fr} }
/* ⑤ Bảng Dòng thời gian / Các lần góp / rút của một người: nhãn loại lệnh · lệnh huỷ gạch ngang trừ nhãn + ghi chú · menu ⋯. */
.quy-bang tr.da-huy td.quy-khong-gach{text-decoration:none}
.quy-nhan-gop,.quy-nhan-rut,.quy-nhan-vang{display:inline-block; font-size:12px; font-weight:600; padding:1px 8px; border-radius:10px; white-space:nowrap}
.quy-nhan-gop{background:color-mix(in srgb, var(--up) 12%, transparent); color:var(--up)}
.quy-nhan-rut{background:var(--down-soft); color:var(--down)}
.quy-nhan-vang{background:color-mix(in srgb, var(--gold) 14%, transparent); color:var(--gold)}
.quy-ba-cham{position:relative; width:1%}
.quy-nut-3{color:var(--txt); font-size:13.5px; line-height:1; padding:2px 8px}
.quy-menu{position:absolute; right:0; top:100%; z-index:6; min-width:180px; display:flex; flex-direction:column; text-align:left;
  background:var(--panel); border:1px solid var(--line); border-radius:10px; box-shadow:0 6px 18px rgba(0,0,0,.12)}
.quy-menu button{all:unset; cursor:pointer; padding:8px 12px; font-size:13px; color:var(--down); border-bottom:1px solid var(--line-soft)}
.quy-menu button:last-child{border-bottom:0}
.quy-menu button:disabled{cursor:not-allowed; color:var(--dim2)}

/* (#91) Trang Quỹ TO · RÕ · THOÁNG như mockup DEV ManageFT (anh gật 27/09 23:51, cửa sổ «e6f109c1»). Chỉ THÊM, chỉ lớp `quy-`,
   không đổi bố cục, không đổi màu chủ đạo. Đè cỡ chữ / đệm của các khối cũ bên trên (#75 · #77 · #78 · #81 · #82 · #88).
   ① Bảng: chữ 13.5px, hàng cao hơn, số đậm thẳng cột, tiêu đề cột viết hoa thưa chữ. Bảng trái tầng 2 (nửa màn) 13px cho vừa 8 cột. */
#trQuy .quy-bang table{font-size:14px}
#trQuy .quy-khu-trai .quy-bang table{font-size:13.5px}
#trQuy .quy-bang thead th{padding:11px 12px; font-size:12.5px; font-weight:600; letter-spacing:.06em; color:var(--dim)}
#trQuy .quy-bang tbody td{padding:12px 12px; border-bottom:1px solid var(--line-soft); vertical-align:middle}
#trQuy .quy-khu-trai .quy-bang thead th{padding:10px 9px}
#trQuy .quy-khu-trai .quy-bang tbody td{padding:10px 9px}
#trQuy .quy-bang tbody tr:last-child td{border-bottom:0}
#trQuy .quy-bang td.p, #trQuy .quy-bang td.num{font-variant-numeric:tabular-nums; font-weight:600}
#trQuy .quy-bang td.p small, #trQuy .quy-bang td.num small{font-weight:500}
#trQuy .quy-bang tbody tr:not(.chon):not(.quy-nhom):hover td{background:var(--line-soft)}
#trQuy .quy-ten b, #trQuy .quy-nguoi{font-weight:600}
#trQuy .quy-ten small, #trQuy .quy-bang td.p small{font-size:12.5px}
#trQuy .quy-bang tr.quy-nhom td{font-size:12.5px; padding:8px 12px}
#trQuy .quy-khu-trai .quy-bang tr.quy-nhom td{padding:8px 9px}
/* ② Tiêu đề khu · tab con · chữ mở đầu · chân bảng · báo lỗi: to hơn một nấc. */
#trQuy .quy-tt{font-size:15px}
#trQuy .quy-tt small{font-size:13.5px}
#trQuy .quy-tab-con{font-size:14px; gap:18px}
#trQuy .quy-chu-mo, #trQuy .quy-loi{font-size:14px}
#trQuy .quy-chan{font-size:13.5px}
#trQuy .quy-tq-canh{font-size:14px}
#trQuy .quy-gd-dong{font-size:14px; padding:9px 0}
/* ③ Ô số Tổng quan (6 ô) + Thành tích Nhà đầu tư (9 ô) + thẻ Dòng tiền: số to, ô thoáng. */
#trQuy .quy-tq-o{gap:14px}
#trQuy .quy-tq-the{border-radius:12px; padding:16px 18px; gap:6px; box-shadow:var(--shadow)}
#trQuy .quy-tq-the span{font-size:13.5px}
#trQuy .quy-tq-the b{font-size:26px; letter-spacing:-.01em}
#trQuy .quy-tq-the small{font-size:13.5px}
#trQuy .quy-o-so-luoi{gap:10px}
#trQuy .quy-o-so{padding:12px 14px; gap:4px; border-radius:10px}
#trQuy .quy-o-so span{font-size:13.5px}
#trQuy .quy-o-so b{font-size:20px; font-variant-numeric:tabular-nums}
#trQuy .quy-o-so small{font-size:13px}
/*   Số tô màu (.len / .xuong) nằm TRONG <b> bị luật nhãn `.quy-o-so span` bắt nhầm ⇒ số lãi nhỏ + mất màu (lỗi có từ trước, Chrome 28/09). */
#trQuy .quy-o-so b span, #trQuy .quy-tq-the b span, #trQuy .quy-the b span{font-size:inherit}
#trQuy .quy-o-so b .len, #trQuy .quy-tq-the b .len, #trQuy .quy-the b .len{color:var(--up)}
#trQuy .quy-o-so b .xuong, #trQuy .quy-tq-the b .xuong, #trQuy .quy-the b .xuong{color:var(--down)}
#trQuy .quy-the{font-size:14px; padding:8px 0}
#trQuy .quy-the.quy-the-ql{padding:10px 12px}   /* ô 🔑 Quản lý quỹ có nền ⇒ giữ lề ngang (soat-loi bắt) */
#trQuy .quy-dt-the .quy-the{padding:14px 16px; border-radius:12px}
#trQuy .quy-dt-the .quy-the b{font-size:22px; font-variant-numeric:tabular-nums}
/* ④ Nút: chính (nền màu) + nhỏ (viền mảnh) to hơn, bo 8px. */
#trQuy .quy-nut-chinh, .quy-hop .quy-nut-chinh{font-size:14px; padding:9px 16px; border-radius:8px}
#trQuy .quy-nut-nho{font-size:13.5px; padding:5px 12px; border-radius:7px}
#trQuy .quy-nut-thoi{font-size:13.5px; padding:7px 14px}
#trQuy .quy-nut-3{font-size:16px; padding:4px 10px; border-radius:7px}
.quy-hop .quy-hop-nut button:not(.quy-nut-chinh){font-size:14px; padding:9px 16px; border-radius:8px}
/* ⑤ Nhãn tròn (Manual · Góp · Rút · đã huỷ · mã người). */
#trQuy .quy-nhan-xam, #trQuy .quy-nhan-xanh, #trQuy .quy-nhan-do,
#trQuy .quy-nhan-gop, #trQuy .quy-nhan-rut, #trQuy .quy-nhan-vang{font-size:13px; padding:3px 10px; border-radius:999px; font-weight:600}
#trQuy .quy-nhan-xam{background:var(--line-soft); color:var(--dim); border:1px solid var(--line)}
#trQuy .quy-nhan-do{background:var(--down-soft)}
/* (#131) Trang Quỹ — "Điều chỉnh ĐVQ" + "Sửa ghi chú": nhãn loại dòng "Điều chỉnh" (màu riêng, khác Góp xanh / Rút đỏ) · hai ô nhập trong hộp xác nhận
   (góc vuông, trải theo bề ngang hộp) · nút ✎ cạnh chữ ghi chú. Không đổi cỡ chữ bảng. */
.quy-nhan-dc{display:inline-block; font-size:12px; font-weight:600; padding:1px 8px; border-radius:10px; white-space:nowrap;
  background:color-mix(in srgb, var(--cool) 14%, transparent); color:var(--cool)}
#trQuy .quy-nhan-dc{font-size:13px; padding:3px 10px; border-radius:999px}
.quy-adj-fields{display:flex; flex-wrap:wrap; gap:10px 14px; margin:10px 0}
.quy-adj-fields label{display:flex; flex-direction:column; gap:4px; flex:1 1 200px; min-width:0; color:var(--dim)}
.quy-adj-fields input{font:inherit; font-size:14px; padding:9px 12px; border:1px solid var(--line); border-radius:0; background:var(--panel); color:var(--txt); min-width:0}
.quy-adj-fields input:focus{outline:none; border-color:var(--cool)}
.quy-note-edit{margin-left:2px}
#trQuy .quy-ma{font-size:13px; height:24px; min-width:34px}
#trQuy .quy-tron{width:32px; height:32px; font-size:13px}
#trQuy .quy-tron.quy-tron-lon{width:48px; height:48px; font-size:15px}
/* ⑥ Ô nhập form Góp / Rút / sửa người + hộp xác nhận: chữ 14px, ô cao, viền sáng khi bấm vào. */
#trQuy .quy-form{gap:12px 16px}
#trQuy .quy-form label, #trQuy .quy-sua label{font-size:13.5px; gap:6px}
#trQuy .quy-form input, #trQuy .quy-form select, #trQuy .quy-sua input, .quy-ly-do textarea{font-size:14px; padding:9px 12px; border-radius:8px}
#trQuy .quy-form input:focus, #trQuy .quy-form select:focus, #trQuy .quy-sua input:focus, .quy-ly-do textarea:focus{
  outline:none; border-color:var(--cool); box-shadow:0 0 0 3px var(--cool-soft)}
#trQuy .quy-sua{padding:14px 16px; border-radius:12px}
.quy-hop-khung{font-size:14px; border-radius:14px; padding:22px 24px; max-width:500px}
.quy-hop-khung h4{font-size:17px; margin-bottom:14px}
.quy-xn-dong{padding:8px 0}
.quy-xn-dong b, .quy-xn-dong strong{font-variant-numeric:tabular-nums}
/* ⑦ Chi tiết Nhà đầu tư: tên to · Phân tích nắm giữ · dải "Nếu rút hết" · menu ⋯. */
#trQuy .quy-ndt-ten{font-size:22px}
#trQuy .quy-ndt-dau .quy-nguoi small{font-size:13.5px}
#trQuy .quy-ndt-tt{padding:16px; border-radius:14px}
#trQuy .quy-pa{padding:16px; border-radius:14px}
#trQuy .quy-pa h5{font-size:15px; margin-bottom:8px}
#trQuy .quy-pa > div{font-size:14px; padding:7px 0}
#trQuy .quy-pa b{font-variant-numeric:tabular-nums}
#trQuy .quy-rut-gon{font-size:14px; padding:10px 14px}
#trQuy .quy-rut-gon .quy-rg-nhan b{font-size:17px}
#trQuy .quy-tg-lech{font-size:14px}
#trQuy .quy-menu{border-radius:12px; min-width:200px}
#trQuy .quy-menu button{font-size:14px; padding:10px 14px}
/* ⑧ Đầu biểu đồ + dòng OHLC. */
#trQuy .quy-ohlc{font-size:13.5px}
#trQuy .quy-nut{height:32px; min-width:34px}

/* (#92) 6 ô Tổng quan trang Quỹ kiểu ô "NAV Tổng" mockup DEV (anh gật 28/09 08:44, cửa sổ «e6f109c1», donviquy.js #18):
   hàng đầu nhãn trái + biểu tượng phải · viên thuốc ↗/↘ số tiền (%) nền xanh / đỏ nhạt. Chỉ THÊM, chỉ lớp `quy-tq-`. */
#trQuy .quy-tq-dau{display:flex; justify-content:space-between; align-items:flex-start; gap:10px; margin-bottom:6px}
#trQuy .quy-tq-icon{width:20px; height:20px; flex:none; fill:none; stroke:var(--dim); stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round}
#trQuy .quy-tq-vien{align-self:flex-start; display:inline-flex; align-items:center; gap:4px; margin-top:6px; padding:3px 10px;
  border-radius:999px; font-style:normal; font-size:13.5px; font-weight:600; font-variant-numeric:tabular-nums; white-space:nowrap;
  max-width:100%; overflow:hidden; text-overflow:ellipsis}
#trQuy .quy-tq-vien.len-nen{background:color-mix(in srgb, var(--up) 12%, transparent); color:var(--up)}
#trQuy .quy-tq-vien.xuong-nen{background:var(--down-soft); color:var(--down)}

/* (#93) Trang Quỹ GỌN · RÕ như mockup DEV (anh duyệt qua ảnh 28/09 sáng, gật 09:24, cửa sổ «d8cf76d6», donviquy.js #19):
   bảng khung viền bo góc + kẻ ngang xám RÕ, chữ bảng nhỏ nhẹ, hàng sát, thẻ nền trắng viền mảnh thay nền xanh / be.
   Chép y bản thử Chrome ở File-MD/NHAP_GIAO_DIEN_QUY_KIEU_DEV_V1.md — đặt CUỐI file nên thắng các luật cùng độ mạnh của #91.
   Hàng kẻ = nét viền pha 12% màu chữ mờ (đậm hơn --line một nấc, nền tối tự đổi theo). */
#trQuy{line-height:1.4}
#trQuy .quy-bang{background:var(--panel); border:1px solid var(--line); border-radius:12px; overflow:auto}
#trQuy .quy-bang table{font-size:13.5px; border-collapse:separate; border-spacing:0}
#trQuy .quy-khu-trai .quy-bang table{font-size:13.5px}
#trQuy .quy-bang thead th{font-size:12px; font-weight:500; letter-spacing:.03em; color:var(--dim); padding:8px 12px;
  border-bottom:1px solid color-mix(in srgb, var(--line) 88%, var(--dim))}
#trQuy .quy-bang tbody td{padding:7px 12px; border-bottom:1px solid color-mix(in srgb, var(--line) 88%, var(--dim))}
#trQuy .quy-khu-trai .quy-bang thead th, #trQuy .quy-khu-trai .quy-bang tbody td{padding:7px 9px}
#trQuy .quy-bang tr.quy-nhom td{padding-top:5px; padding-bottom:5px}
#trQuy .quy-khu-trai .quy-bang tr.quy-nhom td{padding-top:5px; padding-bottom:5px}   /* #91 có luật .quy-khu-trai mạnh hơn dòng trên */
#trQuy .quy-bang tbody tr:last-child td{border-bottom:0}
#trQuy .quy-bang td.p, #trQuy .quy-bang td.num{font-weight:400}
#trQuy .quy-bang td b{font-weight:600}
#trQuy .quy-ten b{font-weight:500}
#trQuy .quy-bang tbody tr:not(.chon):not(.quy-nhom):hover td{background:var(--line-soft)}
#trQuy .quy-ndt-tt{background:var(--panel); border:1px solid var(--line); padding:12px}
#trQuy .quy-o-so-luoi{gap:8px}
#trQuy .quy-o-so{background:var(--panel); border:1px solid var(--line); padding:8px 12px; gap:2px}
#trQuy .quy-rut-gon{background:var(--panel); border:1px solid var(--line); border-left:4px solid var(--gold); padding:7px 12px; margin-top:8px}
#trQuy .quy-pa{background:var(--panel); border:1px solid var(--line); border-radius:12px; padding:10px 14px 4px}
#trQuy .quy-pa h5{font-size:14px; margin:0 0 4px; padding-bottom:7px; border-bottom:1px solid color-mix(in srgb, var(--line) 88%, var(--dim))}
#trQuy .quy-pa > div{font-size:13.5px; padding:6px 0; border-bottom:1px solid color-mix(in srgb, var(--line) 88%, var(--dim)); align-items:center}
#trQuy .quy-pa > div:last-child{border-bottom:0}
#trQuy .quy-pa b{font-weight:600}
#trQuy .quy-pa span small{font-size:12.5px; margin-top:2px}
#trQuy .quy-the, .quy-xn-dong{border-bottom:1px solid color-mix(in srgb, var(--line) 88%, var(--dim)); padding:6px 0}
#trQuy .quy-tq-o{gap:10px; margin-bottom:12px}
#trQuy .quy-tq-the{padding:12px 16px; gap:3px}
#trQuy .quy-tq-dau{margin-bottom:2px}
#trQuy .quy-tq-vien{margin-top:3px}
#trQuy .quy-khoi{margin-top:16px}
#trQuy .quy-than{padding-top:14px}
#trQuy .quy-tab-con{margin:10px 0 6px}
#trQuy .quy-tt{margin-bottom:6px}
/*   Bảng Thành viên: vòng tròn chữ tắt trước tên · nút "Chi tiết ↗" cột cuối (mockup DEV trang Nhà đầu tư). */
#trQuy .quy-member-name{display:flex; align-items:center; gap:10px}
#trQuy .quy-member-avatar{width:30px; height:30px; flex:none; font-size:12px; background:var(--line-soft); color:var(--dim)}
#trQuy .quy-member-detail{white-space:nowrap}
/*   Nhật ký thao tác ("Việc vừa làm gần đây") kiểu trang Audit log DEV: hàng công cụ · nhãn hành động · chân chia trang. */
#trQuy .quy-audit-intro{margin:-2px 0 10px; font-size:13.5px; color:var(--dim)}
#trQuy .quy-audit-toolbar{display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-bottom:10px}
#trQuy .quy-audit-search{position:relative; flex:0 1 330px; min-width:200px}
#trQuy .quy-audit-search input{width:100%; box-sizing:border-box; font:inherit; font-size:13.5px; padding:7px 10px 7px 30px;
  border:1px solid var(--line); border-radius:8px; background:var(--panel); color:var(--txt)}
#trQuy .quy-audit-search-icon{position:absolute; left:9px; top:50%; transform:translateY(-50%); width:15px; height:15px;
  fill:none; stroke:var(--dim); stroke-width:2; stroke-linecap:round; pointer-events:none}
#trQuy .quy-audit-toolbar select{font:inherit; font-size:13.5px; padding:7px 10px; min-width:170px; border:1px solid var(--line);
  border-radius:8px; background:var(--panel); color:var(--txt)}
#trQuy .quy-audit-search input:focus, #trQuy .quy-audit-toolbar select:focus{outline:none; border-color:var(--cool); box-shadow:0 0 0 3px var(--cool-soft)}
#trQuy .quy-audit-csv{margin-left:auto; white-space:nowrap}
#trQuy .quy-audit-time{white-space:nowrap; font-variant-numeric:tabular-nums}
#trQuy .quy-audit-id{font-family:var(--mono); font-size:13px; color:var(--dim); white-space:nowrap}
#trQuy .quy-audit-badge{display:inline-block; padding:1px 9px; border-radius:999px; font-size:12.5px; font-weight:600; line-height:1.6; white-space:nowrap}
#trQuy .quy-audit-badge.is-create{background:var(--txt); color:var(--panel)}
#trQuy .quy-audit-badge.is-void{background:var(--down-soft); color:var(--down)}
#trQuy .quy-audit-badge.is-update{background:color-mix(in srgb, var(--gold) 14%, transparent); color:var(--gold)}
#trQuy .quy-audit-badge.is-import{background:var(--cool-soft); color:var(--cool)}
#trQuy .quy-audit-badge.is-other{background:var(--line-soft); color:var(--dim)}
#trQuy .quy-audit-footer{display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; margin-top:8px}
#trQuy .quy-audit-footer .quy-chan{margin:0}
#trQuy .quy-audit-pager{display:flex; align-items:center; gap:8px; font-size:13.5px; color:var(--dim)}
#trQuy .quy-audit-pager button:disabled{opacity:.45; cursor:default}

/* (#94) GIAO DIỆN KIỂU DEV — anh gật 29/09 00:44, đo mẫu powercrypto.vr2.space. Chữ trong BẢNG giữ nguyên (anh cần nhiều số một lượt).
   ① Thanh tab tầng 3 `.hang-tab` (dùng CHUNG cho trang Chỉ số + Quỹ + trang về sau) ⇒ thanh nút gạt: khung nền nhạt bo tròn co vừa chữ,
      ô đang chọn nền trắng nổi lên (ảnh 2 DEV "Cashflow USDT | Chi phí vận hành"), chữ 16. Luật cũ dòng ~565 vẫn nằm đó, khối này đè. */
.hang-tab{width:fit-content; max-width:calc(100% - 40px); margin:16px 20px 2px; padding:3px; gap:2px;
  background:var(--line); border-radius:10px}   /* var(--line) chứ không --line-soft: nền trang --ink gần trùng --line-soft (soát lỗi 29/09) */
.hang-tab a{min-width:0; height:auto; padding:6px 16px; margin:0; border:0; border-radius:8px;
  font-size:16px; font-weight:500; line-height:22px; color:var(--dim); background:transparent}
.hang-tab.quy-hang-tab{margin-top:34px}   /* giữ khoảng hở cũ trang Quỹ: 18 (margin) + 16 (đệm cũ) */
.hang-tab a:hover{color:var(--txt)}
.hang-tab a[aria-current="page"]{color:var(--txt); background:var(--panel);
  box-shadow:0 1px 3px rgba(0,0,0,.1), 0 1px 2px -1px rgba(0,0,0,.1)}
@media (max-width:560px){
  .hang-tab{width:auto; max-width:none; margin:12px 12px 2px}
  .hang-tab a{flex:1 1 45%; height:44px; font-size:15px; padding:0 8px}
}
/* ② 6 ô Tổng quan quỹ (ảnh 1 DEV "Cashflow ròng"): nhãn to + đậm + chữ đậm màu, con số nhỏ lại. Dòng nhỏ dưới số GIỮ NGUYÊN. */
#quyTqO .quy-tq-dau > span{font-size:15px; font-weight:500; color:var(--txt)}
#quyTqO .quy-tq-the > b{font-size:24px; font-weight:600}
/* ③ 3 nút đầu tab Nhà đầu tư (ảnh 3 DEV): "＋ Góp vốn" nền đậm cho nổi · Sửa + Rút nền trắng viền mảnh. Chọn theo dấu `data-ndt-di`
   có sẵn ở donviquy.js — KHÔNG đụng JS. Giao diện tối tự đảo: nền sáng chữ tối, vẫn nổi. */
#trQuy .quy-ndt-nut{align-items:center}
#trQuy .quy-ndt-nut .quy-nut-nho{height:32px; box-sizing:border-box; display:inline-flex; align-items:center; padding:0 12px;
  font-size:13.5px; font-weight:500; border-radius:8px; border:1px solid var(--line); background:var(--panel); color:var(--txt)}
#trQuy .quy-ndt-nut .quy-nut-nho:hover{background:var(--line-soft)}
#trQuy .quy-ndt-nut .quy-nut-nho[data-ndt-di="gop"]{padding:0 14px; font-size:14px; border-radius:10px;
  border-color:var(--txt); background:var(--txt); color:var(--panel)}
#trQuy .quy-ndt-nut .quy-nut-nho[data-ndt-di="gop"]:hover{opacity:.88}
/* ④ Chân bảng "Chỉ số & Thành viên" ⇒ dải nền nhạt bo góc dưới, dính đáy bảng — y chân biểu đồ `.src`. Chỉ tô khi CÓ CHỮ (lúc đang
   tải donviquy.js để trống ⇒ không lòi dải rỗng). Trình duyệt chưa hiểu `:has` thì bảng giữ góc tròn, dải vẫn hiện — không vỡ. */
#trQuy #quyBangChan:not(:empty){margin:0; padding:13px 20px; background:var(--line-soft); border:1px solid var(--line);
  border-top:0; border-radius:0 0 12px 12px}   /* 12 = góc bảng #trQuy .quy-bang */
#trQuy #quyBangWrap:has(+ #quyBangChan:not(:empty)){border-bottom-left-radius:0; border-bottom-right-radius:0}
/* (#95) TRANG THƯ VIỆN (GĐ4 File-MD/ke-hoach-thu-vien-v1.md, cửa sổ «84b4ed5f», anh gật 00:53) — `#trThuVien`, thuvien.js #1 vẽ.
   Chép theo mẫu đã duyệt Mockups/mau-trang-thu-vien-ppl-v2.html, mọi class tiền tố `tv-` và BÓ DƯỚI `#trThuVien`: style.css có luật thẻ
   trần (`table{min-width:900px}`, h1, h2…) đè vào chữ tài liệu. Chỉ THÊM lớp mới — KHÔNG đè `.hang-tab` chung (bài test_giao_dien_94):
   thanh "Toàn văn / Bản hướng dẫn" dùng lại đúng `.hang-tab`, chỉ đặt lại lề cho khít đầu bài. Chữ bảng GIỮ NHỎ (anh chốt: 12,5 · tiêu đề 11). */
#trThuVien{--tv-violet:#7C3AED; --tv-gold-text:#B45309; --tv-rule:color-mix(in srgb,var(--line) 88%,var(--dim));
  --tv-mark:color-mix(in srgb,var(--gold) 26%,transparent); --tv-pop-shadow:0 8px 24px rgba(15,23,42,.14)}
[data-theme="dark"] #trThuVien{--tv-violet:#B392F0; --tv-gold-text:#E3B341; --tv-pop-shadow:0 10px 28px rgba(0,0,0,.5)}
#trThuVien .tv-icon{width:16px; height:16px; flex:none; fill:none; stroke:currentColor; stroke-width:1.75; stroke-linecap:round; stroke-linejoin:round}
#trThuVien [hidden]{display:none !important}
#trThuVien a{color:var(--cool); text-decoration:none}
#trThuVien a:hover{text-decoration:underline; text-underline-offset:2px}
#trThuVien button, #trThuVien input{font:inherit; color:inherit}
#trThuVien code{font-family:var(--mono); font-size:.9em; background:var(--line-soft); border:1px solid var(--line); border-radius:6px; padding:0 4px}
#trThuVien kbd{display:inline-block; min-width:18px; padding:0 4px; font-family:var(--mono); font-size:13px; line-height:16px; text-align:center;
  color:var(--dim); background:var(--panel); border:1px solid var(--line); border-bottom-width:2px; border-radius:6px}

/* Bố cục 3 cột co giãn hết bề ngang (luật 24/09): danh sách · bài · mục lục */
#trThuVien .tv-layout{display:grid; grid-template-columns:272px minmax(0,1fr) 244px; align-items:start;
  min-height:calc(100vh - var(--t1-h)); background:var(--ink); color:var(--txt); font-size:14px; line-height:1.45}
#trThuVien .tv-layout.is-wide{grid-template-columns:272px minmax(0,1fr)}
#trThuVien .tv-layout.is-wide .tv-toc{display:none}

/* Cột trái */
#trThuVien .tv-sidebar{position:sticky; top:var(--t1-h); z-index:30; height:calc(100vh - var(--t1-h)); display:flex; flex-direction:column;
  background:var(--panel); border-right:1px solid var(--line)}
#trThuVien .tv-sidebar-search{display:flex; align-items:center; gap:8px; padding:16px 16px 8px}
#trThuVien .tv-sidebar-toggle{display:none; align-items:center; gap:6px; flex:none; height:36px; padding:0 10px; border:1px solid var(--line);
  border-radius:10px; background:var(--panel); font-size:13.5px; font-weight:500; cursor:pointer}
#trThuVien .tv-sidebar.is-open .tv-sidebar-toggle{background:var(--side-active); border-color:transparent; color:var(--cool)}
#trThuVien .tv-search-field{position:relative; flex:1 1 auto; min-width:0}
#trThuVien .tv-search-field > .tv-icon{position:absolute; left:10px; top:50%; transform:translateY(-50%); color:var(--dim2); pointer-events:none}
#trThuVien .tv-search-field input{width:100%; height:36px; padding:0 34px 0 32px; border:1px solid var(--line); border-radius:10px;
  background:var(--ink); font-size:14px; color:var(--txt); outline:none; box-sizing:border-box}
#trThuVien .tv-search-field input::placeholder{color:var(--dim2)}
#trThuVien .tv-search-field input:focus{border-color:var(--cool); background:var(--panel); box-shadow:0 0 0 3px color-mix(in srgb,var(--cool) 18%,transparent)}
#trThuVien .tv-search-field input::-webkit-search-cancel-button{-webkit-appearance:none; appearance:none}
#trThuVien .tv-search-kbd{position:absolute; right:8px; top:50%; transform:translateY(-50%); pointer-events:none}
#trThuVien .tv-search-clear{position:absolute; right:5px; top:50%; transform:translateY(-50%); display:grid; place-items:center; width:26px; height:26px;
  padding:0; border:0; border-radius:6px; background:var(--panel); color:var(--dim); cursor:pointer}
#trThuVien .tv-search-clear:hover{background:var(--line-soft); color:var(--txt)}
#trThuVien .tv-nav{flex:1 1 auto; overflow-y:auto; overscroll-behavior:contain; padding:4px 8px 16px}
#trThuVien .tv-nav-item{display:flex; align-items:center; gap:8px; padding:6px 8px; border-radius:8px; color:var(--side-txt); font-size:14px; line-height:1.3}
#trThuVien .tv-nav-item:hover{background:var(--side-hover); text-decoration:none}
#trThuVien .tv-nav-item.is-active{background:var(--side-active); color:var(--cool); font-weight:600}
#trThuVien .tv-nav-item .tv-icon{width:15px; height:15px; color:var(--dim)}
#trThuVien .tv-nav-item.is-active .tv-icon{color:var(--cool)}
#trThuVien .tv-nav-label{flex:1 1 auto; min-width:0}
#trThuVien .tv-nav-meta{display:flex; align-items:center; gap:6px; flex:none}
#trThuVien .tv-nav-version{font-size:13px; font-weight:500; color:var(--dim2); font-variant-numeric:tabular-nums}
#trThuVien .tv-nav-group{margin-top:16px}
#trThuVien .tv-nav-group-title{display:flex; align-items:center; justify-content:space-between; padding:0 8px 4px; font-size:13px; font-weight:600;
  letter-spacing:.04em; text-transform:uppercase; color:var(--dim2)}
#trThuVien .tv-nav-count{font-weight:500; letter-spacing:0; font-variant-numeric:tabular-nums}
#trThuVien .tv-sidebar-footer{padding:10px 16px; border-top:1px solid var(--line); font-size:13px; line-height:1.4; color:var(--dim2)}

/* Cột giữa */
#trThuVien .tv-main{min-width:0; padding:16px 40px 72px}
#trThuVien .tv-notice{margin:0 0 16px; display:flex; align-items:flex-start; gap:10px; padding:10px 8px 10px 16px; background:var(--panel);
  border:1px solid var(--line); border-left:4px solid var(--gold); border-radius:10px; font-size:13.5px; line-height:1.45}
#trThuVien .tv-notice > span{flex:1 1 auto}
#trThuVien .tv-notice button{display:grid; place-items:center; width:24px; height:24px; padding:0; border:0; border-radius:6px; background:none; color:var(--dim); cursor:pointer}
#trThuVien .tv-state{padding:48px 16px; text-align:center; color:var(--dim); font-size:15px; line-height:1.6}
#trThuVien .tv-breadcrumb{display:flex; flex-wrap:wrap; align-items:center; gap:4px; font-size:13.5px; color:var(--dim)}
#trThuVien .tv-breadcrumb a{color:var(--dim)}
#trThuVien .tv-breadcrumb a:hover{color:var(--cool)}
#trThuVien .tv-breadcrumb .tv-icon{width:12px; height:12px; color:var(--dim2)}
#trThuVien .tv-doc-header{display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin:8px 0 14px}
#trThuVien .tv-doc-heading{min-width:0}
#trThuVien .tv-doc-title{margin:0; font-size:24px; font-weight:700; line-height:1.25; overflow-wrap:anywhere; color:var(--txt)}
#trThuVien .tv-doc-source{margin-top:4px; font-size:13px; color:var(--dim)}
#trThuVien .tv-doc-actions{display:flex; flex-wrap:wrap; gap:6px; flex:none}
/* Nút phụ kiểu DEV (mảnh `kieu-giao-dien-dev`): nền trắng, viền mảnh, cao 32, chữ 13 đậm 500, bo 8 */
#trThuVien .tv-button{display:inline-flex; align-items:center; gap:6px; height:32px; padding:0 12px; border:1px solid var(--line); border-radius:8px;
  background:var(--panel); color:var(--txt); font-size:13.5px; font-weight:500; white-space:nowrap; cursor:pointer; box-sizing:border-box}
#trThuVien .tv-button:hover{background:var(--line-soft); text-decoration:none}
#trThuVien .tv-button .tv-icon{width:15px; height:15px; color:var(--dim)}
#trThuVien .tv-doc-meta{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1px; margin:0; background:var(--line);
  border:1px solid var(--line); border-radius:10px; overflow:hidden}
#trThuVien .tv-meta-item{min-width:0; padding:10px 16px; background:var(--panel)}
#trThuVien .tv-meta-item dt{margin-bottom:3px; font-size:13px; font-weight:500; letter-spacing:.03em; color:var(--dim)}
#trThuVien .tv-meta-item dd{margin:0; font-size:13.5px; font-weight:500; font-variant-numeric:tabular-nums; color:var(--txt)}
#trThuVien .tv-doc-controls{display:flex; flex-wrap:wrap; align-items:center; gap:8px 16px; padding:14px 0 12px; border-bottom:1px solid var(--line)}
#trThuVien .hang-tab.tv-layer{margin:0}
#trThuVien .tv-layer-note{font-size:13px; color:var(--dim2)}
#trThuVien .tv-callout{margin:16px 0; padding:12px 16px; background:var(--panel); border:1px solid var(--line); border-left:4px solid var(--cool); border-radius:10px}
#trThuVien .tv-callout-warning{border-left-color:var(--gold)}
#trThuVien .tv-callout-warning .tv-callout-title{color:var(--tv-gold-text)}
#trThuVien .tv-callout-status{border-left-color:var(--tv-violet)}
#trThuVien .tv-callout-status .tv-callout-title{color:var(--tv-violet)}
#trThuVien .tv-callout-title{margin-bottom:4px; font-size:13px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--dim)}
#trThuVien .tv-callout p{margin:0; max-width:75ch; font-size:14px; line-height:1.5}
#trThuVien .tv-tag{display:inline-block; padding:1px 8px; border-radius:6px; font-size:13px; font-weight:600; line-height:16px; white-space:nowrap; vertical-align:middle}
#trThuVien .tv-tag-cool{color:var(--cool); background:color-mix(in srgb,var(--cool) 12%,transparent)}
#trThuVien .tv-tag-muted{color:var(--side-txt); background:color-mix(in srgb,var(--dim) 12%,transparent)}
#trThuVien .tv-tag-violet{color:var(--tv-violet); background:color-mix(in srgb,var(--tv-violet) 12%,transparent)}
/* Thanh "Đang đọc" — chỉ dưới 1180px (không còn cột mục lục bên phải), dính theo khi cuộn */
#trThuVien .tv-reading-bar{display:none; position:sticky; top:var(--t1-h); z-index:20; margin:0 -40px 12px; padding:0 40px; background:var(--ink); border-bottom:1px solid var(--line)}
#trThuVien .tv-reading-button{display:flex; align-items:center; gap:8px; width:100%; height:40px; padding:0; border:0; background:none; font-size:13.5px; color:var(--txt); text-align:left; cursor:pointer}
#trThuVien .tv-reading-label{flex:none; font-weight:600; color:var(--dim)}
#trThuVien .tv-reading-current{flex:1 1 auto; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:600}
#trThuVien .tv-reading-button .tv-icon{transition:transform .15s; color:var(--dim)}
#trThuVien .tv-reading-bar.is-open .tv-reading-button .tv-icon{transform:rotate(90deg)}
#trThuVien .tv-reading-toc{position:absolute; left:24px; right:24px; top:100%; max-height:60vh; overflow:auto; padding:8px 16px 12px; background:var(--panel);
  border:1px solid var(--line); border-radius:10px; box-shadow:var(--tv-pop-shadow)}

/* Chữ tài liệu (HTML máy dựng: h1–h4 · p · ul/ol · blockquote · div.ppl-cuon > table · pre · code) */
#trThuVien .tv-prose{font-size:14px; color:var(--txt); padding-top:4px}
#trThuVien .tv-prose .tv-hidden-dup{display:none}
#trThuVien .tv-prose p, #trThuVien .tv-prose li{max-width:75ch; line-height:1.5}
#trThuVien .tv-prose p{margin:0 0 10px}
#trThuVien .tv-prose ul, #trThuVien .tv-prose ol{margin:0 0 12px; padding-left:22px}
#trThuVien .tv-prose li{margin:3px 0}
#trThuVien .tv-prose h1{margin:16px 0 12px; font-size:20px; font-weight:700; line-height:1.3}
#trThuVien .tv-prose h2{margin:34px 0 10px; padding-top:22px; border-top:1px solid var(--line); font-size:20px; font-weight:700; line-height:1.3; scroll-margin-top:calc(var(--t1-h) + 12px)}
#trThuVien .tv-prose h3{margin:24px 0 8px; font-size:16px; font-weight:700; line-height:1.35; scroll-margin-top:calc(var(--t1-h) + 12px)}
#trThuVien .tv-prose h4{margin:18px 0 6px; font-size:14px; font-weight:700; line-height:1.35}
#trThuVien .tv-prose blockquote{margin:12px 0 16px; padding:10px 16px; background:var(--panel); border:1px solid var(--line); border-left:4px solid var(--cool); border-radius:10px}
#trThuVien .tv-prose blockquote p:last-child{margin-bottom:0}
#trThuVien .tv-prose hr{margin:24px 0; border:0; border-top:1px solid var(--line)}
#trThuVien .tv-prose pre{margin:12px 0 16px; padding:12px 16px; overflow-x:auto; background:var(--code-bg); color:var(--code-txt); border-radius:10px;
  font-family:var(--mono); font-size:13.5px; line-height:1.55}
#trThuVien .tv-prose pre code{background:none; border:0; padding:0; color:inherit}
#trThuVien .tv-prose .ppl-cuon{margin:12px 0 16px; overflow-x:auto; background:var(--panel); border:1px solid var(--line); border-radius:10px}
#trThuVien .tv-prose table{width:100%; min-width:0; border-collapse:collapse; font-size:13.5px; line-height:1.4}
#trThuVien .tv-prose th{padding:8px 12px; text-align:left; font-size:12px; font-weight:500; letter-spacing:.03em; color:var(--dim); border-bottom:1px solid var(--tv-rule); vertical-align:bottom}
#trThuVien .tv-prose td{padding:7px 12px; vertical-align:top; border-bottom:1px solid var(--tv-rule)}
#trThuVien .tv-prose th:first-child, #trThuVien .tv-prose td:first-child{padding-left:16px}
#trThuVien .tv-prose th:last-child, #trThuVien .tv-prose td:last-child{padding-right:16px}
#trThuVien .tv-prose tbody tr:last-child td{border-bottom:0}
#trThuVien .tv-prose tbody tr:hover{background:var(--line-soft)}
#trThuVien .tv-is-target{animation:tv-target-flash 2.6s ease-out}
@keyframes tv-target-flash{0%,35%{background:var(--tv-mark); box-shadow:0 0 0 6px var(--tv-mark)}100%{background:transparent; box-shadow:0 0 0 6px transparent}}

/* Cuối bài */
#trThuVien .tv-related{margin-top:40px}
#trThuVien .tv-block-title{margin:0 0 10px; font-size:13.5px; font-weight:700; border:0; padding:0}
#trThuVien .tv-related-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,220px),1fr)); gap:10px}
#trThuVien .tv-related-card{display:flex; flex-direction:column; gap:2px; padding:12px 16px; background:var(--panel); border:1px solid var(--line); border-radius:10px; color:var(--txt)}
#trThuVien .tv-related-card:hover{border-color:color-mix(in srgb,var(--cool) 45%,var(--line)); text-decoration:none}
#trThuVien .tv-related-area{font-size:13px; font-weight:500; letter-spacing:.03em; color:var(--dim)}
#trThuVien .tv-related-title{font-size:14px; font-weight:600}
#trThuVien .tv-related-note{font-size:13.5px; line-height:1.4; color:var(--dim)}
#trThuVien .tv-prev-next{display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:24px}
#trThuVien .tv-prev-next-link{display:flex; flex-direction:column; gap:3px; padding:12px 16px; background:var(--panel); border:1px solid var(--line); border-radius:10px}
#trThuVien .tv-prev-next-link:hover{border-color:color-mix(in srgb,var(--cool) 45%,var(--line)); text-decoration:none}
#trThuVien .tv-prev-next-link.is-next{align-items:flex-end; text-align:right}
#trThuVien .tv-prev-next-label{display:inline-flex; align-items:center; gap:6px; font-size:13px; color:var(--dim)}
#trThuVien .tv-prev-next-label .tv-icon{width:14px; height:14px}
#trThuVien .tv-prev-next-title{font-size:14px; font-weight:600; color:var(--txt)}

/* Cột phải — mục lục */
#trThuVien .tv-toc{position:sticky; top:var(--t1-h); height:calc(100vh - var(--t1-h)); overflow-y:auto; padding:16px 16px 24px 8px; box-sizing:border-box}
#trThuVien .tv-toc-title{margin:0 0 8px 14px; font-size:13px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--dim2)}
#trThuVien .tv-toc-list{display:flex; flex-direction:column}
#trThuVien .tv-toc-link{display:flex; gap:6px; padding:4px 0 4px 12px; border-left:2px solid var(--line); font-size:13.5px; line-height:1.35; color:var(--dim)}
#trThuVien .tv-toc-link:hover{color:var(--txt); text-decoration:none}
#trThuVien .tv-toc-link.is-sub{padding-left:24px; font-size:13px}
#trThuVien .tv-toc-link.is-active{border-left-color:var(--cool); color:var(--cool); font-weight:600}
#trThuVien .tv-toc-text{display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden}
#trThuVien .tv-toc-top{display:inline-flex; align-items:center; gap:6px; margin:12px 0 0 14px; padding:0; border:0; background:none; font-size:13px; color:var(--dim); cursor:pointer}
#trThuVien .tv-toc-top:hover{color:var(--cool)}
#trThuVien .tv-toc-top .tv-icon{width:14px; height:14px}

/* Trang đầu */
#trThuVien .tv-home-header{margin:4px 0 20px}
#trThuVien .tv-home-lead{max-width:75ch; margin:6px 0 10px; font-size:14px; line-height:1.5; color:var(--dim)}
#trThuVien .tv-home-facts{display:flex; flex-wrap:wrap; gap:6px 18px; font-size:13.5px; color:var(--dim)}
#trThuVien .tv-home-facts b{font-weight:600; color:var(--txt); font-variant-numeric:tabular-nums}
#trThuVien .tv-area-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr)); gap:12px}
#trThuVien .tv-panel-card{overflow:hidden; background:var(--panel); border:1px solid var(--line); border-radius:10px}
#trThuVien .tv-panel-head{display:flex; align-items:center; justify-content:space-between; gap:10px; padding:11px 16px; border-bottom:1px solid var(--line)}
#trThuVien .tv-panel-head h2{margin:0; font-size:14px; font-weight:700; border:0; padding:0}
#trThuVien .tv-panel-count{font-size:13px; color:var(--dim2)}
#trThuVien .tv-area-doc{display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 16px; border-bottom:1px solid var(--tv-rule); color:var(--txt)}
#trThuVien .tv-area-doc:last-child{border-bottom:0}
#trThuVien .tv-area-doc:hover{background:var(--line-soft); text-decoration:none}
#trThuVien .tv-area-doc-main{display:flex; flex-direction:column; gap:1px; min-width:0}
#trThuVien .tv-area-doc-title{font-size:14px; font-weight:600}
#trThuVien .tv-area-doc-desc{font-size:13px; line-height:1.4; color:var(--dim)}
#trThuVien .tv-area-doc-meta{display:flex; flex-direction:column; align-items:flex-end; gap:3px; flex:none; font-size:13px; color:var(--dim2); font-variant-numeric:tabular-nums}

/* Kết quả tìm */
#trThuVien .tv-search-header{display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:6px 16px; margin:4px 0 12px}
#trThuVien .tv-search-summary{font-size:13.5px; color:var(--dim)}
#trThuVien .tv-table-frame{overflow-x:auto; background:var(--panel); border:1px solid var(--line); border-radius:10px}
#trThuVien .tv-results{width:100%; min-width:0; border-collapse:collapse; font-size:13.5px}
#trThuVien .tv-results td{padding:8px 16px; vertical-align:top; border-bottom:1px solid var(--tv-rule)}
#trThuVien .tv-results tr:last-child td{border-bottom:0}
#trThuVien .tv-result-group td{padding:12px 16px 6px}
#trThuVien .tv-group-title{margin-right:8px; font-size:13.5px; font-weight:700; color:var(--txt)}
#trThuVien .tv-result-row{cursor:pointer}
#trThuVien .tv-result-row:hover, #trThuVien .tv-result-row:focus-visible{background:var(--line-soft); outline:none}
#trThuVien .tv-result-title{font-weight:600}
#trThuVien .tv-result-snippet{font-size:13.5px; line-height:1.5; color:var(--dim)}
#trThuVien .tv-result-empty td{padding:22px 16px; text-align:center; color:var(--dim)}
#trThuVien mark{padding:0 1px; border-radius:6px; background:var(--tv-mark); color:inherit}
#trThuVien .tv-toast{position:fixed; left:50%; bottom:24px; z-index:70; max-width:calc(100vw - 32px); padding:8px 14px; background:var(--txt); color:var(--panel);
  border-radius:8px; box-shadow:var(--tv-pop-shadow); font-size:13.5px; opacity:0; pointer-events:none; transform:translate(-50%,12px); transition:opacity .16s, transform .16s}
#trThuVien .tv-toast.is-visible{opacity:1; transform:translate(-50%,0)}

/* Khung xem nhanh trong hộp (?) trang chính (index.html #208 gắn vào `#ghiChuNoiDung`) */
#ghiChuNoiDung .tv-preview{margin-top:10px; padding:10px 12px; background:var(--line-soft); border:1px solid var(--line); border-left:3px solid var(--gold); border-radius:8px}
#ghiChuNoiDung .tv-preview[hidden]{display:none}
#ghiChuNoiDung .tv-preview b{display:block; margin-bottom:4px}
#ghiChuNoiDung .tv-preview p{margin:0 0 8px; font-size:13.5px; line-height:1.5}
#ghiChuNoiDung .tv-preview button{height:32px; padding:0 14px; border:1px solid var(--txt); border-radius:10px; background:var(--txt); color:var(--panel);
  font-size:14px; font-weight:500; cursor:pointer}

/* Co giãn */
@media (max-width:1179px){
  #trThuVien .tv-layout, #trThuVien .tv-layout.is-wide{grid-template-columns:260px minmax(0,1fr)}
  #trThuVien .tv-toc{display:none}
  #trThuVien .tv-main{padding:16px 28px 64px}
  #trThuVien .tv-reading-bar{display:block; margin:0 -28px 12px; padding:0 28px}
  #trThuVien .tv-reading-bar[hidden]{display:none}
}
@media (max-width:859px){
  #trThuVien .tv-layout{display:block}
  #trThuVien .tv-sidebar{height:auto; border-right:0; border-bottom:1px solid var(--line)}
  #trThuVien .tv-sidebar-search{padding:10px 16px}
  #trThuVien .tv-sidebar-toggle{display:inline-flex}
  #trThuVien .tv-sidebar-footer, #trThuVien .tv-nav{display:none}
  #trThuVien .tv-sidebar.is-open .tv-nav{display:block; position:absolute; top:100%; left:0; right:0; max-height:calc(100vh - var(--t1-h) - 72px);
    padding:8px 8px 16px; background:var(--panel); border-bottom:1px solid var(--line); box-shadow:var(--tv-pop-shadow)}
  #trThuVien .tv-main{padding:16px 16px 56px}
  #trThuVien .tv-reading-bar{top:calc(var(--t1-h) + 57px); margin:0 -16px 12px; padding:0 16px}
  #trThuVien .tv-reading-toc{left:8px; right:8px}
  #trThuVien .tv-doc-header{flex-direction:column; gap:10px}
  #trThuVien .tv-doc-meta{grid-template-columns:repeat(2,minmax(0,1fr))}
  #trThuVien .tv-prev-next{grid-template-columns:1fr}
  /* Ô nhập ≥ 16px để Safari trên iPhone không tự phóng to trang khi chạm */
  #trThuVien .tv-search-field input{font-size:16px}
}
@media (max-width:640px){
  #trThuVien .tv-search-kbd{display:none}
  #trThuVien .tv-area-doc{align-items:flex-start}
}
/* Luật thẻ trần của trang chính rò vào Thư viện (soát lỗi 29/09): `section{padding:52px 0}` · `thead th{text-transform:uppercase;
   white-space:nowrap}` · `dt{text-transform:uppercase}` · `#trThuVien a{color}` thắng màu `.hang-tab a` ⇒ đặt lại trong khung. */
#trThuVien section{padding:0}
#trThuVien .tv-prose th, #trThuVien .tv-meta-item dt{text-transform:none; white-space:normal}
#trThuVien .hang-tab a{color:var(--dim)}
#trThuVien .hang-tab a:hover{color:var(--txt); text-decoration:none}
#trThuVien .hang-tab a[aria-current="page"]{color:var(--txt)}
/*   (#116 ①, nhóm trang Thư viện) Khung, thẻ, dải, hộp nổi của Thư viện ⇒ GÓC VUÔNG — đi cùng khối (#116) ở cuối file (anh duyệt mẫu 08:55 05/10/2026). Nhóm này nằm Ở ĐÂY chứ không
     ở cuối file vì bài test_thu_vien_trang chốt F3 cấm mọi luật của trang Thư viện nằm ngoài khối #95. Bộ chọn chép NGUYÊN từ các luật phía trên trong khối; đứng sau nên thắng.
     GIỮ bo: nút, ô tìm, nhãn `.tv-tag`, mục điều hướng `.tv-nav-item`. */
#trThuVien .tv-notice, #trThuVien .tv-doc-meta, #trThuVien .tv-callout, #trThuVien .tv-reading-toc, #trThuVien .tv-prose blockquote,
#trThuVien .tv-prose pre, #trThuVien .tv-prose .ppl-cuon, #trThuVien .tv-related-card, #trThuVien .tv-prev-next-link, #trThuVien .tv-panel-card,
#trThuVien .tv-table-frame, #trThuVien .tv-toast, #ghiChuNoiDung .tv-preview{border-radius:0}
/*   chữ code / phím / chữ tô sáng trong bài viết */
#trThuVien code, #trThuVien kbd, #trThuVien mark{border-radius:0}
/* (#96) GIAO DIỆN ĐỢT 2 · 6 Ý — anh gật 29/09 06:04 (File-MD/nhap-giao-dien-dot2-v1.md, cửa sổ «18e677b6»). Chữ trong BẢNG giữ nguyên.
   ① Tab Nhà đầu tư: khung "Phân tích nắm giữ" kéo xuống bằng đáy cột trái. */
#trQuy .quy-ndt-hai{align-items:stretch}
/* ② "Nếu rút hết hôm nay" — 5 ô một hàng, nhãn nhỏ trên, số dưới (donviquy.js #23 `.quy-rg-luoi`). Hàng chiếm trọn bề ngang dưới tiêu đề.
   (#107) Mỗi ô rộng THEO CHỮ của nó rồi chia đều chỗ thừa — nhãn dài ("− Chia cho quỹ 50 % (trên lãi)") không rớt dòng, số to ("⇒ Nhận về") không tràn;
   thiếu chỗ (màn cỡ laptop trở xuống) thì ô cuối tự xuống hàng. Số nằm đáy ô ⇒ các ô CÙNG HÀNG luôn thẳng hàng.
   Ô nào cũng có vạch ngăn + đệm trái như nhau; cả hàng dịch trái 15px rồi cắt bỏ đúng 15px đó (`clip-path`) ⇒ ô ĐẦU MỖI HÀNG (kể cả hàng xuống dòng)
   mất vạch, chữ sát mép trái thẳng với tiêu đề — không còn phải dựa `:first-child` (chỉ đúng cho hàng một). */
#trQuy .quy-rut-gon .quy-rg-luoi{flex:1 0 100%; display:flex; flex-wrap:wrap; gap:8px 0; margin-top:2px; margin-left:-15px; clip-path:inset(0 0 0 15px)}
#trQuy .quy-rut-gon .quy-rg-luoi > div{flex:1 1 auto; display:flex; flex-direction:column; justify-content:space-between; padding:4px 14px; border-left:1px solid var(--line)}
#trQuy .quy-rut-gon .quy-rg-luoi small, #trQuy .quy-rut-gon .quy-rg-luoi b{white-space:nowrap}
#trQuy .quy-rut-gon .quy-rg-luoi small{display:block; font-size:13px; color:var(--dim)}
#trQuy .quy-rut-gon .quy-rg-luoi b{display:block; font-size:15px; font-weight:600; font-variant-numeric:tabular-nums; margin-top:2px}
#trQuy .quy-rut-gon .quy-rg-luoi .tong b{font-size:18px; color:var(--up)}
@media (max-width:700px){
  #trQuy .quy-rut-gon .quy-rg-luoi{gap:6px 0}
}
/* ③ ④ Mọi nhóm nút kiểu tab ⇒ nút gạt (khung xám, ô chọn nền sáng + bóng), BỎ gạch chân (`.quy-tab-con`, `.tf-ck-nut`) và viên
   thuốc tím (`.tf-tab3-nut`, `.tf-cd-nut`, `.khu4-tab`). `.toggle-group` = khung chỉ bọc các nút (index.html #209), dòng báo / nút
   Toàn màn hình / nút "?" nằm ngoài. Luật cũ có tiền tố id `:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac)` ⇒ luật mới cùng tiền tố, đứng sau nên thắng. */
#trQuy .quy-tab-con, :is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) :is(.tf-ck-the,.toggle-group,.khu4-nav){display:inline-flex; width:fit-content; gap:2px;
  padding:3px; background:var(--line); border:0; border-radius:8px; vertical-align:middle;
  flex-wrap:wrap; max-width:100%}
#trQuy .quy-tab-con{display:flex; margin:22px 0 10px; font-size:13.5px}
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .khu4-nav, :is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #lsCard .khu4-nav{margin:9px 12px 0; padding:3px}
#trQuy .quy-tab-con a, :is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) :is(.tf-ck-nut,.tf-tab3-nut,.tf-cd-nut,.khu4-tab){font-size:13.5px; font-weight:500;
  line-height:1.4; padding:4px 12px; border:0; border-radius:6px; background:transparent; color:var(--dim); box-shadow:none; cursor:pointer}
#trQuy .quy-tab-con a:hover, :is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) :is(.tf-ck-nut,.tf-tab3-nut,.tf-cd-nut,.khu4-tab):hover:not(.chon){background:transparent; color:var(--txt)}
#trQuy .quy-tab-con a[aria-current], :is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) :is(.tf-ck-nut,.tf-tab3-nut,.tf-cd-nut,.khu4-tab).chon{background:var(--panel);
  color:var(--txt); font-weight:500; box-shadow:0 1px 3px rgba(0,0,0,.1), 0 1px 2px -1px rgba(0,0,0,.1)}
/* ⑤ Chân bảng Thành viên còn 1 dòng (câu đủ ở title, donviquy.js #23) · bảng luôn có thanh kéo dọc. */
#trQuy #quyBangChan:not(:empty){white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:13px}
#trQuy #quyBangWrap{overflow-y:scroll}
/* ⑥ Cột Mã bảng Thành viên = vòng tròn xám ghi MÃ (mã dài thì giãn thành viên thuốc) · vạch hàng đang chọn tím → đen ở mọi bảng. */
#trQuy #quyNdtBang .quy-member-avatar{width:auto; min-width:30px; padding:0 6px; border-radius:15px}
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) tr.tf-chiso.chon td:first-child, .quy-bang tr.quy-dong.chon td:first-child{box-shadow:inset 3px 0 0 var(--txt)}
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-bang tr.tf-ckv.chon td{box-shadow:inset 2px 0 0 var(--txt)}
/* (#97) THANH TRÊN: CHỮ MENU + CHUÔNG BÁO — anh gật 29/09 08:49 (cửa sổ «18e677b6»), anh đã xem bản vẽ thử trên Chrome.
   ① Chữ menu thanh trên: to hơn một nấc, đậm vừa; mục đang chọn chữ đen đậm + gạch chân đen (trước là tím). Luật gốc ở khối
   "THANH TRÊN" (~dòng 499) — khối này đứng sau nên thắng. Màn hẹp ≤560px vẫn phải ép chữ 13 ⇒ đặt lại ở @media cuối khối. */
.t1-nav{gap:22px; font-size:15px}
.t1-nav > a{color:var(--dim); font-weight:500; letter-spacing:-.005em; padding:6px 0}
.t1-nav > a:hover{color:var(--txt)}
.t1-nav > a.t1-chon{color:var(--txt); font-weight:600; border-bottom-color:var(--txt)}
/* ② Nút chuông (index.html #210) — CHỈ anh (admin) thấy, nav.js #32 bật + đổ chữ. Số tròn góc trên phải: cam = có việc
   trễ · đỏ (`.is-red`) = có chỗ hỏng. Khung thả xuống theo khuôn menu 👤 `.tk-menu`: mở/đóng bằng `hidden`, luật `[hidden]` viết
   riêng vì `display:grid` / `display:flex` bên dưới sẽ đè mất `hidden` của trình duyệt. Màu toàn bằng biến ⇒ giao diện tối tự ăn. */
.notify-wrap{position:relative}
.notify-wrap[hidden]{display:none}
.notify-bell{position:relative; width:36px; height:34px; border:1px solid var(--line); border-radius:10px; background:var(--panel);
  display:grid; place-items:center; color:var(--txt); cursor:pointer; padding:0; font:inherit}
.notify-bell[hidden]{display:none}
.notify-bell svg{width:17px; height:17px}
.notify-bell:hover{background:var(--side-hover)}
.notify-bell:focus-visible{outline:2px solid var(--cool); outline-offset:2px}
.notify-count{position:absolute; top:-7px; right:-7px; min-width:17px; height:17px; padding:0 4px; box-sizing:border-box;
  border-radius:9px; background:#F59E0B; color:#fff; font:700 10px/17px system-ui,sans-serif; text-align:center}
.notify-count.is-red{background:var(--down)}
.notify-count[hidden]{display:none}
.notify-panel{position:absolute; right:0; top:calc(100% + 8px); width:340px; max-width:calc(100vw - 32px); z-index:46;
  box-sizing:border-box; padding:6px; background:var(--panel); border:1px solid var(--line); border-radius:12px;
  box-shadow:0 8px 24px rgba(15,23,42,.14); white-space:normal; font-size:14px; letter-spacing:0}
.notify-panel[hidden]{display:none}
.notify-head{display:flex; align-items:baseline; justify-content:space-between; gap:12px; padding:6px 8px 8px;
  border-bottom:1px solid var(--line)}
.notify-title{font-size:14px; font-weight:600; color:var(--txt)}
.notify-checked{font-size:13px; color:var(--dim); white-space:nowrap}
.notify-list{list-style:none; margin:0; padding:0; max-height:min(60vh, 420px); overflow-y:auto}
.notify-item{display:grid; grid-template-columns:8px minmax(0, 1fr); column-gap:10px; row-gap:2px; padding:9px 8px}
.notify-item + .notify-item{border-top:1px solid var(--line)}
.notify-dot{width:8px; height:8px; border-radius:50%; margin-top:6px; background:#F59E0B}
.notify-item.is-red .notify-dot{background:var(--down)}
.notify-text{line-height:1.4; color:var(--txt); overflow-wrap:anywhere}
.notify-time{grid-column:2; font-size:13px; color:var(--dim)}
.notify-empty{padding:12px 8px; color:var(--txt)}
@media (max-width:560px){
  .t1-nav{gap:10px; font-size:13.5px}
  /* Chuông đứng lệch trái nút 👤 ⇒ khung rộng 340 bám phải chuông sẽ thò ra mép trái màn điện thoại ⇒ bám hai mép màn. */
  .notify-panel{position:fixed; left:12px; right:12px; top:calc(var(--t1-h) + 4px); width:auto; max-width:none}
}

/* ============================================================
   (#98) HỘP (?) TRANG QUỸ — nút "?" cạnh nhãn (donviquy.js #24 `hoi()`), chữ lấy từ Thư viện THEO VAI (thuvien.js #2).
   Nút bó dưới #trQuy; thân mục bó dưới `#ghiChuNoiDung .quy-hoi-than` (khung dùng chung, đừng làm lệch hộp (?) các tab khác).
   ============================================================ */
#trQuy .quy-hoi{display:inline-flex; align-items:center; justify-content:center; flex:none; width:15px; height:15px; margin:0 0 0 5px; padding:0;
  border:1px solid var(--line); border-radius:50%; background:transparent; color:var(--dim); font:600 10px/1 var(--font);
  vertical-align:middle; cursor:pointer; text-transform:none; letter-spacing:0}
#trQuy .quy-hoi::before{content:"?"}
#trQuy .quy-hoi:hover, #trQuy .quy-hoi:focus-visible{color:var(--txt); border-color:var(--txt); outline:none}
#trQuy .quy-o-banh{position:relative}
#trQuy .quy-hoi-goc{position:absolute; top:4px; right:4px; z-index:1; margin:0}
#trQuy .quy-tab-hang{display:flex; align-items:center; gap:4px}
#ghiChuNoiDung .quy-hoi-than{overflow-x:auto}
#ghiChuNoiDung .quy-hoi-than h4{margin:14px 0 8px; font-size:14px}
#ghiChuNoiDung .quy-hoi-than table{min-width:0; width:100%; border-collapse:collapse; font-size:13.5px; margin:0 0 12px}
#ghiChuNoiDung .quy-hoi-than th, #ghiChuNoiDung .quy-hoi-than td{border:1px solid var(--line); padding:4px 6px; text-align:left; vertical-align:top}
#ghiChuNoiDung .quy-hoi-than pre{overflow-x:auto; padding:8px 10px; border-radius:6px; background:var(--code-bg); color:var(--code-txt); font:12px/1.5 var(--mono)}
#ghiChuNoiDung .quy-hoi-than code{font-family:var(--mono); font-size:.92em}
#ghiChuNoiDung .quy-hoi-than ul, #ghiChuNoiDung .quy-hoi-than ol{margin:0 0 12px; padding-left:20px}
#ghiChuNoiDung .quy-hoi-di{margin:14px 0 0}

/* ============================================================
   (#99) NGUỒN GỐC CHỈ SỐ ở chân trang (nav.js #34 `openOrigin`, anh gật 29/09 12:05).
   Nút chữ `#footOrigin` trong dòng chân chung `.chan-trang`, cỡ chữ ăn theo dòng đó (không phóng). Thân hộp bó dưới #ghiChuNoiDung.
   ============================================================ */
.chan-trang .foot-origin{display:inline; margin:0; padding:0; border:0; background:none; font:inherit;
  color:var(--dim); text-decoration:underline; text-underline-offset:3px; cursor:pointer}
.chan-trang .foot-origin:hover, .chan-trang .foot-origin:focus-visible{color:var(--txt); outline:none}
/* (#125) Link "Chính sách riêng tư" + email liên hệ ở dòng chân: cùng kiểu chữ gạch chân với nút "Nguồn gốc chỉ số". */
.chan-trang .foot-link{color:var(--dim); text-decoration:underline; text-underline-offset:3px}
.chan-trang .foot-link:hover, .chan-trang .foot-link:focus-visible{color:var(--txt)}
/* #118: câu miễn trừ nằm ngay dưới dòng chân, cùng cỡ chữ + màu của dòng đó (không khung, không phóng). `#method[hidden]`: tầng author để không luật `display` nào về sau làm mục này hiện lại. */
.chan-trang .foot-disclaimer{max-width:120ch; margin:8px auto 0; line-height:1.6}
#method[hidden]{display:none}
#ghiChuNoiDung .foot-origin-links{margin:14px 0 0; font-size:13.5px; color:var(--dim)}
#ghiChuNoiDung .foot-origin-links a{color:inherit; text-decoration:underline; text-underline-offset:3px}
#ghiChuNoiDung .foot-origin-library{padding:0; border:0; background:none; font:inherit; color:var(--txt); text-decoration:underline;
  text-underline-offset:3px; cursor:pointer}

/* (#100) Trang Quỹ — email tài khoản đăng nhập đã gắn, một dòng ngay dưới tên nhà đầu tư (bản admin + bản người dùng). */
.quy-ndt-dau .quy-nguoi .quy-ndt-email{display:block; font-size:13.5px; color:var(--dim); font-weight:400}

/* ============================================================
   (#101) NÚT ĐEN · CHỮ ĐEN · TIÊU ĐỀ VIÊN NANG · CHÂN BẢNG NÚT (cửa sổ «c39e536a», anh gật 29/09 16:10 — donviquy #27 · taifu #75 · index #215).
   Luật màu anh chốt: ĐỎ chỉ cho số âm, lệnh bán / rút, nút huỷ. Nút chính = nền ĐEN như "＋ Góp vốn" (biến `--txt`, giao diện tối tự đảo).
   ============================================================ */
/* ① Nút chính toàn trang nền đen (trước là tím `--cool`). `.nut.phu`, `.nhac .nut` có luật mạnh hơn ⇒ giữ màu riêng. */
.nut{background:var(--txt); color:var(--panel)}
.nut:hover:not([disabled]){opacity:.88}
.quy-nut-chinh{border-color:var(--txt); background:var(--txt); color:var(--panel)}
.quy-nut-chinh:hover:not(:disabled){opacity:.88}
/* ② Nút nhỏ trang Quỹ (Chi tiết ↗, Xuất CSV, Trước / Sau, Tải về, 📎, Đính, Sửa, Đã kiểm, ⋯…) chữ ĐEN — trước đỏ cả loạt vì lớp gốc
   `.quy-nut-nho` mặc định `--down`. Chỉ nút Huỷ / Bỏ / Rút trước hạn giữ đỏ. */
.quy-nut-nho{color:var(--txt)}
.quy-nut-nho:hover:not(:disabled){background:var(--line-soft)}
.quy-nut-nho:disabled{color:var(--dim2); cursor:not-allowed}
.quy-nut-nho[data-huy-id], .quy-nut-nho[data-tkr-huy], .quy-nut-nho[data-hs-bo], .quy-nut-nho[data-tk-rut]{color:var(--down)}
/* ③ Tiêu đề tầng 2 (Quỹ: "Chỉ số & Thành viên" · "Biểu đồ nến"; Chỉ số: "Biểu đồ nến") trong khung viên nang — dáng nút
   "✎ Thay đổi thông tin", chữ to hơn một cỡ (15 → 16). Chữ phụ nhỏ đã bỏ ở index.html. */
.tt-vien{display:inline-flex; align-items:center; align-self:flex-start; height:34px; box-sizing:border-box; padding:0 14px;
  border:1px solid var(--line); border-radius:10px; background:var(--panel); color:var(--txt); font-size:16px; font-weight:600;
  letter-spacing:0; box-shadow:0 1px 2px rgba(0,0,0,.05)}
#trQuy .quy-tt.tt-vien{font-size:16px; margin-bottom:10px}
/*   Trang Chỉ số: hai thẻ "Chỉ số & Danh mục" | "Danh mục công khai" ĐÃ là nút gạt viên nang từ #96 (`.toggle-group`) ⇒ không đè. */
/* ④ Chân bảng = hàng nút: trái "＋ Thêm thành viên mới" / "＋ Tạo danh mục mới" nền đen · phải ⛶. Dải nền nhạt bo góc dưới,
   dính đáy bảng (y chân cũ `#quyBangChan` #94). */
.bang-chan{display:flex; align-items:center; gap:8px; margin:0; padding:8px 12px; background:var(--line-soft);
  border:1px solid var(--line); border-top:0; border-radius:0 0 12px 12px}
.bang-chan > .quy-nut, .bang-chan > .tf-nut{margin-left:auto}
/*   Luật chân chữ cũ `#trQuy #quyBangChan:not(:empty)` (#94 · #98: đệm 13px 20px, cắt chữ một dòng) mạnh hơn — đè lại cho hàng nút. */
#trQuy #quyBangChan:not(:empty){padding:8px 12px; overflow:visible; white-space:nowrap; font-size:inherit}
#quyBangWrap, #tfBang1Wrap{border-bottom-left-radius:0; border-bottom-right-radius:0}
.nut-den{all:unset; box-sizing:border-box; cursor:pointer; display:inline-flex; align-items:center; height:32px; padding:0 14px;
  border-radius:10px; background:var(--txt); color:var(--panel); font-size:14px; font-weight:600; white-space:nowrap}
.nut-den:hover{opacity:.88}
.nut-den:focus-visible{outline:2px solid var(--txt); outline-offset:2px}
.nut-den[hidden]{display:none}
/*   Chân Chỉ số nằm trong khu #1 cao cố định ⇒ không được co. */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-1 .bang-chan{flex:none}
/* ⑤ ⛶ bung CẢ khung bảng ra toàn màn hình — cùng bộ thuộc tính `#trTaifu .th-3.tf-full` (mảnh hop-toan-man-hinh): gỡ mọi trần
   chiều cao + `contain:size` để bảng dùng trọn khung. */
#trQuy .quy-khu-trai.quy-full, :is(#trTaifu,#tang2) .th-1.tf-full{position:fixed; inset:16px; z-index:60; margin:0; max-width:none; height:auto;
  background:var(--ink); border-radius:var(--r); padding:16px 18px; box-shadow:0 20px 60px rgba(0,0,0,.35); overflow:hidden}
#trQuy .quy-khu-trai.quy-full > .quy-bang{contain:none; flex:1 1 auto; min-height:0; height:auto}
:is(#trTaifu,#tang2) .th-1.tf-full .bang{flex:1; min-height:0; max-height:none}
:is(#trTaifu,#tang2) .th-1.tf-full .th-thu{display:none}
/* ⑥ Menu ⋯ ở bảng Các lần góp / rút NỔI hẳn (position:fixed, donviquy.js #27 đặt toạ độ) — trước bị khung bảng có thanh cuộn cắt mất. */
#trQuy .quy-menu{position:fixed; right:auto; top:auto; z-index:900}

/* ============================================================
   (#102) VÁ SAU KHI LÊN V215 (cửa sổ «c39e536a», anh gật 29/09 17:13 — index #216).
   ============================================================ */
/* ① Bỏ chữ "Biểu đồ nến" nhưng GIỮ CHỖ: ô trống cùng chiều cao `.tt-vien` (34px) ⇒ khung biểu đồ đứng yên, mép trên bằng bảng trái. */
.tt-vien.tt-giu-cho{display:block; height:34px; visibility:hidden; width:0; padding:0; border:0; box-shadow:none}   /* block: ô rỗng inline-flex làm khung tụt 6px (đo 29/09) */
/* ② ⛶ đứng SÁT nút đen (ảnh anh 29/09), không dạt sang mép phải nữa. */
.bang-chan > .quy-nut, .bang-chan > .tf-nut{margin-left:0}
/* ③ Chân bảng Quỹ cao 45px = dải chân biểu đồ bên phải ⇒ hai đường kẻ trên của hai dải thẳng hàng, bảng dài thêm xuống. */
#trQuy #quyBangChan:not(:empty){height:45px; box-sizing:border-box; padding-top:0; padding-bottom:0}   /* 45 = đo trang thật: đỉnh dải trái = đỉnh dải chân biểu đồ */

/* ============================================================
   (#103) TRANG QUỸ ĐỢT A — BỊT ĐƯỜNG SỬA + LƯU TRỮ (cửa sổ «e696daec», mẫu Mockups/mau-quy-luu-tru-va-trung-ten-v3.html — donviquy #30 · index #223).
   Mọi luật bó dưới `#trQuy` / `#trCaiDatQuy` ⇒ không đụng trang Chỉ số.
   ============================================================ */
/* ① Cài đặt quỹ — khối "Danh mục của quỹ" (màn 6): mỗi danh mục một dòng, tên + chữ phụ bên trái, nhãn / nút bên phải. */
#trCaiDatQuy .quy-portfolio-block{margin-top:18px; padding:14px 16px; border:1px solid var(--line); border-radius:12px; background:var(--panel)}
#trCaiDatQuy .quy-portfolio-block .quy-tt{font-size:15px; margin:0 0 4px}
#trCaiDatQuy .quy-portfolio-block .quy-tt ~ .quy-tt{margin-top:18px}
#trCaiDatQuy .quy-portfolio-block .quy-tt small{font-size:13.5px; margin-left:6px}
#trCaiDatQuy .quy-portfolio-block .quy-chu-mo, #trCaiDatQuy .quy-portfolio-block .quy-loi{margin:8px 0; font-size:14px}
#trCaiDatQuy .quy-portfolio-block .quy-chu-mo:empty{display:none}
#trCaiDatQuy .quy-portfolio-row{display:flex; align-items:center; gap:10px; flex-wrap:wrap; padding:10px 0; border-bottom:1px solid var(--line-soft); font-size:14px}
#trCaiDatQuy .quy-portfolio-row:last-child{border-bottom:0}
#trCaiDatQuy .quy-portfolio-row.dimmed{opacity:.5}
#trCaiDatQuy .quy-portfolio-name{flex:1 1 200px; min-width:0}
#trCaiDatQuy .quy-portfolio-name small{display:block; color:var(--dim2); font-size:13px}
#trCaiDatQuy .quy-portfolio-reason{color:var(--dim2); font-size:13.5px}
#trCaiDatQuy .quy-portfolio-row .quy-nut-nho{font-size:13.5px; padding:5px 12px; border-radius:7px}
/* ② Bảng Chi phí vận hành: nút Huỷ chữ đỏ (luật màu #101: đỏ cho nút huỷ) · lý do huỷ một dòng nhỏ dưới nhãn "Đã huỷ", không gạch. */
#trQuy .quy-nut-nho[data-expense-void]{color:var(--down)}
#trQuy .quy-void-reason{display:block; margin-top:2px; font-size:12.5px; color:var(--dim2); text-decoration:none}
/* ③ Hộp "Thêm thành viên mới" (màn 3): ô tên trải hết bề ngang · thẻ người trùng tên / người đang giữ số điện thoại · câu nhắc vì sao nút mờ. */
#trQuy .quy-them-nguoi .quy-form-wide{flex-basis:100%}
#trQuy .quy-them-nguoi[hidden]{display:none}
#trQuy #quyThemLower{margin-top:12px}
#trQuy .quy-required{color:var(--down)}
#trQuy .quy-form input.quy-input-error{border-color:var(--down); box-shadow:0 0 0 3px color-mix(in srgb, var(--down) 18%, transparent)}
#trQuy .quy-match{margin-top:14px; border:1px solid var(--gold); border-radius:10px; padding:12px; background:color-mix(in srgb, var(--gold) 6%, transparent)}
#trQuy .quy-match-title{font-weight:600; margin:0 0 8px}
#trQuy .quy-match-card{display:flex; align-items:center; gap:10px; flex-wrap:wrap; background:var(--panel); border:1px solid var(--line); border-radius:10px;
  padding:10px 12px; margin-bottom:8px}
#trQuy .quy-match-info{flex:1 1 180px; min-width:0}
#trQuy .quy-match-info b{display:block}
#trQuy .quy-match-detail{font-size:13px; color:var(--dim)}
#trQuy .quy-match-actions{display:flex; justify-content:flex-end}
#trQuy .quy-match-actions .quy-nut-nho.chosen{background:var(--txt); color:var(--panel); border-color:var(--txt)}
#trQuy .quy-add-hint{color:var(--dim); font-size:13.5px; margin:8px 0 0}
#trQuy .quy-add-hint:empty, #trQuy #quyThemBao:empty{display:none}
/* ④ Mục Thành viên (màn 4): nút Xoá chữ đỏ · câu nhắc ngay dưới đầu thẻ người. */
#trQuy .quy-nut-nho[data-member-delete]{color:var(--down)}
#trQuy .quy-member-note{margin:6px 2px 10px}
/* ⑤ Nút gạt "Chỉ số & Thành viên | Đã rút hết vốn" (màn 1) — cùng dáng nút gạt ở ③④ của #99 (khung xám, ô chọn nền sáng + bóng),
   cao 34px = tiêu đề `.tt-vien` nó thay chỗ ⇒ bảng và khung biểu đồ bên phải không xê dịch. Chỉ quản lý thấy (donviquy.js #30). */
#trQuy .quy-view-switch{display:inline-flex; align-self:flex-start; align-items:stretch; gap:2px; height:34px; box-sizing:border-box; padding:3px;
  margin:0 0 10px; background:var(--line); border-radius:8px; max-width:100%}
#trQuy .quy-view-switch[hidden], #trQuy .quy-archive-note[hidden], #trQuy #quyBangTitle[hidden]{display:none}
#trQuy .quy-view-button{all:unset; box-sizing:border-box; display:inline-flex; align-items:center; cursor:pointer; font-size:13.5px; font-weight:500;
  padding:0 12px; border-radius:6px; color:var(--dim); white-space:nowrap}
#trQuy .quy-view-button:hover{color:var(--txt)}
#trQuy .quy-view-button.chosen{background:var(--panel); color:var(--txt); box-shadow:0 1px 3px rgba(0,0,0,.1), 0 1px 2px -1px rgba(0,0,0,.1)}
#trQuy .quy-view-button:focus-visible{outline:2px solid var(--cool); outline-offset:1px}
#trQuy .quy-view-count{display:inline-block; min-width:18px; margin-left:5px; padding:0 5px; border-radius:9px; background:var(--line-soft);
  color:var(--dim); font-size:12px; line-height:16px; text-align:center}
/* Bảng lưu trữ: dòng "Chưa có ai rút hết vốn." · chân bảng là một câu giải thích (dài thì cắt "…", câu đủ ở title), ⛶ dạt phải. */
#trQuy .quy-archive-empty{text-align:center; padding:18px 8px; color:var(--dim2)}
#trQuy .quy-archive-note{flex:1 1 auto; min-width:0; overflow:hidden; text-overflow:ellipsis; color:var(--dim2); font-size:13.5px}
/* ============================================================
   (#109) HỘP XEM GIẤY TỜ + MENU ⋯ BẢNG GIẤY TỜ (cửa sổ «819ad0bb», anh gật 16:31 04/10 — donviquy #41 · index #241).
   ============================================================ */
/* ① Menu ⋯ của bảng giấy tờ: "Xem" / "Tải về" chữ thường; riêng "Bỏ vào Thùng rác" giữ đỏ của `.quy-menu button`. */
.quy-menu button.quy-menu-plain{color:var(--txt)}
/* ② Hộp nổi xem ảnh / PDF (`#quyXemTep`, treo ở body): rộng gần hết màn hình, ảnh co vừa khung, PDF nằm trong khung cuộn được. */
.quy-xem-tep{z-index:990}   /* dưới cổng đăng nhập `.dn-nen` (1000): vé hết hạn thì cổng che giấy tờ, trên menu ⋯ (900) */
.quy-xem-tep .quy-hop-khung{width:96vw; max-width:1100px; max-height:94vh; display:flex; flex-direction:column; padding:14px 16px}
.quy-xem-dau{display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:10px}
.quy-xem-dau h4{margin:0; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.quy-xem-dau .quy-hop-nut{margin-top:0; flex:none}
.quy-xem-than{flex:1 1 auto; min-height:0; overflow:auto; text-align:center}
img.quy-xem-noi-dung{max-width:100%; max-height:80vh; object-fit:contain}
iframe.quy-xem-noi-dung{display:block; width:100%; height:78vh; border:1px solid var(--line); border-radius:8px; background:#fff}
/* ③ (26/10/2026) Thu phóng ảnh trong hộp xem: thanh nút − % + "Vừa khung" trên ảnh; khung ảnh tự cuộn, đã phóng thì nắm kéo (con trỏ bàn tay). */
.quy-xem-zoom{display:flex; align-items:center; justify-content:center; gap:8px; flex-wrap:wrap; margin-bottom:8px}
.quy-xem-zoom button{font:inherit; font-size:13px; min-width:32px; padding:4px 10px; border-radius:0; border:1px solid var(--line); background:transparent; color:var(--txt); cursor:pointer}
.quy-xem-zoom button:disabled{opacity:.4; cursor:default}
.quy-xem-zoom [data-zoom-text]{min-width:46px; font-size:13px; font-variant-numeric:tabular-nums}
.quy-xem-zoom small{font-size:11.5px}
.quy-xem-anh{max-height:72vh; overflow:auto}
.quy-xem-anh img.quy-xem-noi-dung{max-height:72vh}
.quy-xem-anh.dang-phong{cursor:grab; touch-action:none}
.quy-xem-anh.dang-phong:active{cursor:grabbing}

/* (#110) TAB "DÒNG TIỀN" TRANG QUỸ LÀM LẠI (cửa sổ «8037b552», anh gật 19:04 04/10; mẫu Mockups/mockup-quy-dong-tien-v1.html). Chỉ THÊM, chỉ lớp `quy-dt-`.
   Đầu tab · khối 6 ô · bảng phải dùng LẠI lớp của chi tiết thành viên (`.quy-ndt-dau` · `.quy-ndt-hai` · `.quy-o-so` · `.quy-pa`); dòng nháp dùng lại
   `.hang-cho` + nút `.nut` của tab Giao dịch ⇒ cả trang một kiểu nhập. */
#trQuy .quy-dt-tron{background:color-mix(in srgb, var(--gold) 18%, transparent); color:var(--gold); font-size:18px}
#trQuy #quyDtChiPhiTyLe{display:contents}   /* khung hai ô tỷ lệ không chiếm ô — hai ô con xếp thẳng vào lưới 6 ô */
#trQuy .quy-pa b.len{color:var(--up)}
#trQuy .quy-pa b.xuong{color:var(--down)}
#trQuy #quyDtSoCai{align-items:center}
/* Hàng nút gạt 3 mục + bộ lọc cùng một dòng. */
#trQuy .quy-dt-hang{display:flex; justify-content:space-between; align-items:center; gap:10px 14px; flex-wrap:wrap; margin:22px 0 10px}
#trQuy .quy-dt-hang .quy-tab-con{margin:0}
#trQuy .quy-dt-loc{display:flex; align-items:center; gap:8px; flex-wrap:wrap}
#trQuy .quy-dt-loc[hidden]{display:none}
#trQuy .quy-dt-loc select, #trQuy .quy-dt-loc input, #trQuy .quy-dt-thanh input{font:inherit; font-size:13.5px; padding:6px 8px; border:1px solid var(--line);
  border-radius:6px; background:var(--panel); color:var(--txt)}
#trQuy .quy-dt-loc input[type="search"]{min-width:200px}
/* Khung bảng bo góc có dòng tiêu đề. */
#trQuy .quy-dt-khung{border:1px solid var(--line); border-radius:12px; background:var(--panel); overflow:hidden}
#trQuy .quy-dt-khung > .quy-bang{overflow-x:auto}
#trQuy .quy-dt-dau{display:flex; align-items:center; gap:8px 10px; flex-wrap:wrap; padding:10px 14px; border-bottom:1px solid var(--line); font-size:14px}
#trQuy .quy-dt-dau small{color:var(--dim); font-size:13px; font-weight:400}
#trQuy .quy-dt-dau .quy-nhan-vang{margin-left:auto}
#trQuy .quy-dt-dau .quy-nhan-vang:empty{display:none}
/* Thanh trên bảng: "+ Thêm …" · ô tìm · "N dòng chưa lưu" · "✓ Lưu nháp" (khuôn tab Giao dịch). */
#trQuy .quy-dt-thanh{display:flex; justify-content:space-between; align-items:center; gap:10px; flex-wrap:wrap; margin:0 0 8px}
#trQuy .quy-dt-thanh > span{display:flex; align-items:center; gap:10px; flex-wrap:wrap}
#trQuy .quy-dt-thanh input[type="search"]{min-width:220px}
#trQuy .quy-dt-cho{color:var(--gold); font-weight:600; font-size:13.5px}
/* Dòng tổng của một sổ (⇔ một coin) + bảng giao dịch mở ra bên dưới. */
#trQuy tr.quy-dt-so{cursor:pointer}
#trQuy .quy-dt-mui{width:28px; text-align:center; color:var(--dim); font-size:15px}
#trQuy .quy-dt-ten{display:block; font-size:14.5px}
#trQuy .quy-dt-nh{display:block; color:var(--dim); font-size:13px; font-weight:400}
#trQuy .quy-dt-hop{background:var(--panel); border:1px solid var(--line); border-radius:10px; padding:0 12px 12px; overflow-x:auto}
#trQuy .quy-dt-con{font-size:13.5px}
#trQuy .quy-dt-stt{width:36px; color:var(--dim2)}
/* Nền: luật rê chuột chung của bảng trang Quỹ tô CẢ ô của bảng lồng bên trong ⇒ đặt lại theo thứ tự: gỡ nền khi rê trong khối mở →
   ô ngoài của khối mở + dòng sổ đang mở nền xám nhạt → dòng bảng con rê chuột → dòng nháp nền vàng (đứng cuối để thắng). */
#trQuy tr.quy-dt-long:hover td{background:transparent !important}
#trQuy .quy-bang tbody tr.quy-dt-long > td{padding:10px 14px 14px; background:var(--line-soft) !important}
#trQuy .quy-bang tbody tr.quy-dt-so.quy-dt-mo > td{background:var(--line-soft) !important}
#trQuy .quy-dt-con tbody tr:hover > td{background:var(--line-soft) !important}
#trQuy .quy-bang tbody tr.quy-dt-nhap > td{background:var(--hang-cho-nen) !important; padding:7px 8px}
#trQuy tr.quy-dt-nhap .quy-dt-stt{color:var(--hang-cho-vien); font-weight:700}
#trQuy tr.quy-dt-nhap input{width:100%; min-width:70px; box-sizing:border-box; font:inherit; font-size:13.5px; padding:5px 7px; border:1px solid var(--line);
  border-radius:6px; background:var(--panel); color:var(--txt)}
#trQuy tr.quy-dt-nhap input[type="number"]{text-align:right}
#trQuy tr.quy-dt-nhap.cho-loi input{border-color:var(--down)}
/* Dải ô có nhãn trong dòng nháp "sổ mới" / "sửa sổ". */
#trQuy .quy-dt-o-hang{display:flex; flex-wrap:wrap; gap:8px 12px; align-items:flex-end}
#trQuy .quy-dt-o-hang label{display:flex; flex-direction:column; gap:3px; font-size:13px; font-weight:400; color:var(--dim); flex:1 1 130px; min-width:110px}
#trQuy .quy-dt-o-hang small{flex-basis:100%}
#trQuy .quy-dt-o-hang small:empty{display:none}
#trQuy .quy-dt-xn-tt{margin:10px 0 4px; font-weight:700; font-size:13.5px}
#trQuy [data-quy-muc="dt"] .quy-ndt-dau .quy-nguoi{white-space:normal; min-width:0}   /* dòng phụ dài: màn hẹp cho xuống dòng, không đẩy tràn */
#trQuy .quy-bang tbody tr.quy-dt-nhap.cho-loi > td{background:var(--down-soft) !important}   /* dòng nháp lỗi: nền đỏ nhạt như tab Giao dịch */

/* (#112) TAB "GIAO DỊCH" TRANG QUỸ — gộp Góp vốn + Rút vốn (cửa sổ «b29265d3», anh gật 19:37 04/10; mẫu Mockups/mockup-quy-giao-dich-v1.html). Chỉ THÊM: lớp mới `quy-gd-` + vài luật trên lớp dùng chung `quy-dt-` (ghi rõ ở từng luật).
   Khung · thanh trên · dòng tổng · bảng lồng · dòng nháp dùng LẠI lớp `quy-dt-` của tab Dòng tiền (#110) ⇒ hai tab một kiểu nhập. Cỡ chữ bảng giữ nguyên (luật 29/09). */
#trQuy .quy-dt-thanh .quy-tab-con{margin:0}   /* nút gạt "Theo thành viên / Tất cả theo ngày" (#quyGdXem) nằm cùng hàng với ô tìm */
/* Ô chọn (thành viên · loại lệnh) trong dòng nháp: y hệt ô input của khối #110. */
#trQuy tr.quy-dt-nhap select{width:100%; min-width:70px; box-sizing:border-box; font:inherit; font-size:13.5px; padding:5px 7px; border:1px solid var(--line);
  border-radius:6px; background:var(--panel); color:var(--txt)}
#trQuy tr.quy-dt-nhap.cho-loi select{border-color:var(--down)}
#trQuy tr.quy-dt-nhap input[type="file"]{min-width:150px}
/* Mẻ "Lưu nháp" đang chạy / đang "rút hết" ⇒ ô khoá, mờ đi. */
#trQuy tr.quy-dt-nhap input:disabled, #trQuy tr.quy-dt-nhap select:disabled{opacity:.55; cursor:not-allowed}
/* Ô số tiền canh phải; dòng Rút có nút "Rút hết" đứng cùng hàng với ô. */
#trQuy tr.quy-dt-nhap input.quy-gd-tien{text-align:right; min-width:120px}
#trQuy tr.quy-dt-nhap input.quy-gd-tien:has(+ button){width:calc(100% - 96px)}
#trQuy tr.quy-dt-nhap input.quy-gd-tien + button{margin-left:6px; white-space:nowrap}
#trQuy .quy-gd-tien-o{display:flex; align-items:center; white-space:nowrap}
#trQuy tr.quy-dt-nhap .quy-gd-tien-o input.quy-gd-tien{flex:1 1 auto; width:auto}
/* Số MÁY CHỦ tạm tính trong dòng nháp: chữ nghiêng, màu mờ (ô bảng lẫn ô có nhãn của khối giao dịch mới). */
#trQuy .quy-gd-may{font-style:italic; font-weight:500; color:var(--dim)}
#trQuy .quy-dt-o-hang output.quy-gd-may{display:block; padding:5px 0; font-size:13.5px; white-space:nowrap}
/* Tên tệp sao kê đã chọn: dài thì cắt … */
#trQuy .quy-gd-tep{display:inline-block; max-width:180px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; vertical-align:middle; font-size:13.5px; color:var(--txt)}
/* Nhãn giả của ô "Sao kê" (KHÔNG dùng thẻ label: bấm chữ sẽ kích nút ✕ gỡ tệp) — trông y hệt label trong `.quy-dt-o-hang`. */
#trQuy .quy-dt-o-hang .quy-gd-nhan{display:flex; flex-direction:column; gap:3px; font-size:13px; font-weight:400; color:var(--dim); flex:1 1 130px; min-width:110px}
#trQuy .quy-dt-o-hang .quy-gd-nhan > span{display:flex; align-items:center; gap:4px; min-width:0}
/* Tên + dòng phụ đứng cạnh vòng tròn mã ở dòng tổng một thành viên. */
#trQuy .quy-gd-nguoi{display:inline-block; vertical-align:middle}
/* Dòng tổng của người ĐÃ RÚT HẾT VỐN: mờ đi như hàng `tr.quy-dong.tat-toan` ở bảng Thành viên; đang mở bảng lệnh thì rõ hơn. */
#trQuy .quy-bang tr.quy-dt-so.tat-toan{opacity:.55}
#trQuy .quy-bang tr.quy-dt-so.tat-toan.quy-dt-mo{opacity:.8}
/* Câu nhắc đỏ dưới ô ngày giờ gõ dở (bảng vẽ lại là ô về trống — không nhắc thì lệnh đi với "bây giờ"). */
#trQuy .quy-gd-gio-do{display:block; margin-top:3px; font-size:12.5px; font-weight:400; line-height:1.35; color:var(--down); white-space:normal}

/* (#113) MẺ GIAO DIỆN NHỎ — anh gật theo phiếu File-MD/ke-hoach-me-sua-giao-dien-nho-v1.md (chỗ c + e).
   (c) Màn hẹp ≤560px: dòng chữ nhỏ "Chỉ số CKV 30 · cập nhật mỗi giờ" dưới tên trang tràn ra đè menu (khối logo được co,
       chữ bên trong cấm xuống dòng) ⇒ ẩn dòng nhỏ; còn thiếu chỗ thì tên bị cắt gọn bằng "…" chứ không đè. Menu không co.
       Chiều cao + vị trí thanh trên KHÔNG đổi (luật thanh trên đứng yên). Màn rộng không đổi gì. */
@media (max-width:560px){
  .t1-logo{overflow:hidden}
  .t1-logo .ten{min-width:0; overflow:hidden; text-overflow:ellipsis}
  .t1-logo .ten small{display:none}
  .t1-nav{flex:none}
}
/* (e) Nền tối: thanh cuộn của hai khung bảng trang Quỹ (bảng thành viên + bảng tổng quan) theo tông tối (trước là vệt trắng chói) —
       cùng cách chữa với `.ns-wrap .ns-bang-cuon` của tab Ngân sách. Bộ chọn HẸP theo id: không khoanh mọi `.quy-bang`, kẻo đổi
       dáng mặc định của ô nhập / ô chọn / ô tệp nằm trong bảng tab Giao dịch và tab Dòng tiền. */
[data-theme="dark"] #quyBangWrap, [data-theme="dark"] #quyNdtBang{color-scheme:dark}
/* (g) Tab Giao dịch trang Quỹ — hai lỗi BỐ CỤC thấy trên trang thật (điều phối «3b0f90b4» đo Chrome 04/10), không đụng số:
       · ô "Thành viên" của dòng tổng: vòng tròn mã (`.quy-tron` là khối `display:grid`) đẩy tên xuống dòng dưới, tên rớt 2–3 dòng ⇒
         vòng tròn thành khối TRONG DÒNG đứng cùng hàng với tên, ô cấm xuống dòng;
       · màn ~1512px bảng rộng hơn khung, cột cuối bị cắt ⇒ bớt lề ngang ô của bảng tổng 12px → 8px. Cỡ chữ GIỮ NGUYÊN, không bó bề ngang. */
#trQuy #quyGdBang tr.quy-dt-so > td:nth-child(2){white-space:nowrap}
#trQuy #quyGdBang tr.quy-dt-so > td:nth-child(2) > .quy-member-avatar{display:inline-grid; vertical-align:middle; margin-right:4px}
#trQuy #quyGdBang > table > thead > tr > th, #trQuy #quyGdBang > table > tbody > tr:not(.quy-dt-long) > td{padding-left:8px; padding-right:8px}
/* (h) Ba ô số tiền tab Dòng tiền (gửi sổ mới · rút trước hạn · chi phí) từ donviquy #44 là ô chữ ⇒ không còn ăn luật canh phải của
       `input[type="number"]`; canh phải lại y như ô tiền tab Giao dịch. Bám đúng ô `data-o="…:amount"`, không kéo theo luật nào khác. */
#trQuy tr.quy-dt-nhap input[data-o$=":amount"]{text-align:right}
/* (i) (#114) Tab Giao dịch trang Quỹ, xem "Theo thành viên" — màn 1536px bảng còn rộng hơn khung ~25px, phải cuộn ngang mới thấy cột cuối
       (điều phối «3b0f90b4» đo trang thật 05/10: bảng 1503px trong khung 1478px). Hai nguồn đẩy rộng, chữa từng nguồn, KHÔNG đụng cỡ chữ / cột:
       · bảng tổng 11 cột: bề ngang tối thiểu = chữ + lề ⇒ bớt lề ngang ô 8px → 6px (11 cột × 4px = 44px). Luật 8px của (g) GIỮ, luật này đứng sau nên thắng;
       · bảng lệnh 14 cột lồng trong dòng mở (nhất là khi có dòng nháp mang ô nhập): bề ngang tối thiểu của nó đẩy cả bảng ngoài rộng theo, khung
         `overflow-x:auto` của `.quy-dt-hop` thành vô dụng ⇒ `contain:inline-size` cho hộp thôi góp bề ngang vào bảng ngoài (quá rộng thì cuộn TRONG hộp),
         và bớt lề ngang ô bảng lồng 12px → 8px để ở 1536px dòng nháp vẫn vừa hộp. Bộ chọn bó theo `#quyGdBang`: tab Dòng tiền (cùng lớp `quy-dt-`) không đổi. */
#trQuy #quyGdBang > table > thead > tr > th, #trQuy #quyGdBang > table > tbody > tr:not(.quy-dt-long) > td{padding-left:6px; padding-right:6px}
#trQuy #quyGdBang .quy-dt-hop{contain:inline-size}
#trQuy #quyGdBang .quy-dt-con > thead > tr > th, #trQuy #quyGdBang .quy-dt-con > tbody > tr > td{padding-left:8px; padding-right:8px}

/* (#116) GIAO DIỆN GÓC VUÔNG · Ô SỐ DẠNG THANH DỌC (thợ ngầm của «3059dba8»; anh duyệt mẫu 08:55 05/10/2026 — Mockups/mockup-giao-dien-goc-vuong-v1.html;
   phiếu File-MD/ke-hoach-giao-dien-goc-vuong-v1.md; đi cặp donviquy.js #46). Chỉ THÊM, đặt CUỐI file, KHÔNG sửa luật cũ nào.
   ① Khung, bảng, thẻ, hộp bánh vòng, dải, hộp nổi ⇒ GÓC VUÔNG ở mọi tab. Mỗi bộ chọn bên dưới CHÉP NGUYÊN bộ chọn của luật cũ đang đặt bo tròn (cùng độ mạnh
      ⇒ luật đứng sau thắng). KHÔNG phủ rộng bằng dấu sao: chỗ nào không có tên ở đây thì giữ nguyên như cũ. Riêng nhóm trang Thư viện nằm ở cuối khối #95.
      GIỮ BO (cố ý KHÔNG có mặt): nút bấm · hàng tab / nút gạt kể cả khay bọc ngoài · ô nhập, ô chọn · nhãn nhỏ hình viên thuốc, huy hiệu · thanh tỷ trọng,
      thanh tiến độ, thanh kéo · vòng tròn tên viết tắt, biểu tượng coin, dấu ?, chấm màu, công tắc gạt · ảnh · hình vẽ tab Ngân sách · tiêu đề dáng nút `.tt-vien`.
      Thêm chỗ bo tròn MỚI vào file này ⇒ phải xếp nó vào danh sách VUÔNG hoặc GIỮ của bài File-Test/test_giao_dien_goc_vuong.js, không thì bài đó đỏ.
      Biến `--r` (14px) để nguyên: mọi nơi đang dùng nó đều đã có tên bên dưới. */
/*   · Khung dùng chung cả trang: thẻ, bảng, hộp bánh vòng, ô số, chân thẻ / chân bảng */
.card, .src, .box, .formula, .disclaimer, .quote, .o, .donut-hop, .bang, .con-scroll, .dongtien, .bang-chan{border-radius:0}
/*   · Dải thông báo dùng chung (báo lỗi, nhắc, cảnh báo) */
.hn-loi-o, #hnLoi, .loi, .nhac, .canh-bao-am{border-radius:0}
/*   · Hộp nổi: hộp thoại, menu thả xuống (kể cả danh sách xổ ra của ô chọn mã), chú giải khi rê chuột, khung chuông báo */
.tip-chung, .donut-tip, #trChanDoan .cd-pb-tip, #trChanDoan .cd-tip, .tk-menu, .bd-val-tip, .bd-help-hop, .xuat-menu, .hop, .o-chon-ds,
.notify-panel{border-radius:0}
/*   · Chế độ phóng to toàn màn hình (bảng, biểu đồ). Bộ chọn cuối viết ĐỦ 3 id (luật cũ ở khối #101 chỉ có 2) cho khớp chốt D của bài test_gd_nhip3 — độ mạnh vẫn bằng luật cũ. */
#bdCard.bd-full, #trTaifu .th-3.tf-full, #trQuy .quy-khu-trai.quy-full, :is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-1.tf-full{border-radius:0}
/*   · Tab Giao dịch: hàng nháp trong bảng */
.hang-cho > td:first-child, .hang-cho > td:last-child{border-radius:0}
/*   · Tab Chỉ số + Dữ liệu thị trường (bảng lịch sử rổ + ô mã tô màu trong bảng đó · chú giải biểu đồ thứ hạng · hộp quản lý coin) */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-bang, :is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-sym, :is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-bump-tip,
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-hop{border-radius:0}
/*   · Tab Chẩn đoán */
#trChanDoan .cd-loi, #trChanDoan .cd-the, #trChanDoan .cd-pb-thieu{border-radius:0}
/*   · Tab Tái cân bằng */
#trTaiCanBang .tcb-the, #trTaiCanBang .tcb-bao-nho{border-radius:0}
/*   · Tab Ngân sách */
.ns-wrap .ns-thanh, .ns-wrap .ns-bao, .ns-wrap .ns-khung, #ghiChuNen .ns-h-ghi, #ghiChuNen .ns-thay, .ns-wrap .ns-khac, #ghiChuNen .ns-h-loi,
.ns-wrap .ns-bang-khung, .ns-wrap .ns-dk-the, .ns-wrap .ns-dk-mau, .ns-wrap .ns-dk-khung, .ns-wrap .ns-dk-tieude, .ns-wrap .ns-dk-o,
#ghiChuNen .ns-bao{border-radius:0}
/*   · Đăng nhập · Tài khoản của tôi · Quản trị (`.qt-doi` = viền vàng quanh Ô BẢNG chưa lưu — nav.js gắn lên thẻ td, không gắn lên ô nhập) */
.dn-hop, .dn-loi, .tk-khoi, .tk-ok, .qt-doi, .qt-hoi{border-radius:0}
/*   · (#124) Thực đơn trái của màn Tài khoản / Quản trị / Cài đặt quỹ: dòng vuông như bản mẫu Mockups/mockup-cai-dat-va-quan-tri-v1.html (đệm + nền dòng đang chọn nằm ở khối #124 cuối tệp) */
.tk-ben a{border-radius:0}
/*   · Trang Quỹ + Cài đặt quỹ */
.quy-hop-khung, .quy-dt-the .quy-the, #trQuy .quy-dt-the .quy-the, .quy-tq-the, #trQuy .quy-tq-the, .quy-the-ql, .quy-sua, #trQuy .quy-sua,
.quy-ndt-tt, #trQuy .quy-ndt-tt, .quy-o-so, #trQuy .quy-o-so, .quy-rut-gon, .quy-pa, #trQuy .quy-pa, .quy-menu, #trQuy .quy-menu, #trQuy .quy-bang,
#trQuy #quyBangChan:not(:empty), #ghiChuNoiDung .quy-hoi-than pre, #trCaiDatQuy .quy-portfolio-block, #trQuy .quy-match, #trQuy .quy-match-card,
iframe.quy-xem-noi-dung, #trQuy .quy-dt-khung, #trQuy .quy-dt-hop{border-radius:0}
/* ② Ô SỐ NẰM TRONG THẺ trang Quỹ (9 ô "Thành tích trọn đời" · 6 ô "Tiền của quỹ hôm nay") ⇒ bỏ hộp bao từng ô: mỗi số một THANH DỌC MỜ ở đầu, các hàng ngăn nhau
   bằng KẺ NGANG MỜ. Cùng mẹo với dải "Nếu rút hết hôm nay" (`.quy-rg-luoi`, #107): cả lưới dịch trái đúng bằng đệm trái của ô (14px) rồi cắt bỏ phần đó (`clip-path`)
   ⇒ ô ĐẦU MỖI HÀNG tự mất thanh dọc, chữ thẳng mép với tiêu đề thẻ; cắt thêm 1px mép trên ⇒ hàng đầu tự mất kẻ ngang. KHÔNG đếm ô ⇒ đúng cả lưới 3 cột, 2 cột (≤560px)
   lẫn khi hai ô tỷ lệ chi phí nằm trong khung không chiếm ô của tab Dòng tiền (khung mang id quyDtChiPhiTyLe, kiểu "display: contents"). Màu lấy từ `--line` ⇒ nền tối tự theo. */
/*   Nền ô = nền thẻ (`--panel`), KHÔNG để trong suốt: màn điện thoại số dài tràn khỏi ô, ô đứng sau phải che phần tràn của ô đứng trước như trước nay — để trong suốt thì
     hai con số đè lên nhau (đo Chrome 420px, 05/10). Mép phải vùng cắt nới -999px để số dài ở cột cuối không bị xén ở mép lưới (trước nay nó thò ra lề thẻ, vẫn đọc được). */
#trQuy .quy-o-so-luoi{gap:0; margin-left:-14px; clip-path:inset(1px -999px 0 14px)}
#trQuy .quy-o-so{position:relative; padding:10px 14px; border:0; border-top:1px solid var(--line); background:var(--panel); box-shadow:none}
#trQuy .quy-o-so::before{content:""; position:absolute; left:0; top:11px; bottom:11px; width:1px; background:var(--line)}
/* ③ SÁU Ô SỐ ĐẦU TAB TỔNG QUAN ⇒ MỘT DẢI NỀN TRẮNG GÓC VUÔNG, cùng kiểu thanh dọc + kẻ ngang. Dải có viền bao nên KHÔNG dùng được mẹo cắt mép của ② (cắt là mất viền)
   ⇒ đếm ô theo số cột của lưới `.quy-tq-o`: 3 cột (màn rộng) · 2 cột (≤900px) · 1 cột (≤560px). Hai mốc này phải khớp hai dòng `@media` của `.quy-tq-o`
   ở khối "(đợt 7) ④" phía trên — đổi mốc ở đó thì đổi theo ở đây. */
#trQuy .quy-tq-o{gap:0; padding:2px 16px; background:var(--panel); border:1px solid var(--line)}
#trQuy .quy-tq-the{position:relative; padding:12px 16px; border:0; border-top:1px solid var(--line); background:var(--panel); box-shadow:none}   /* nền ô = nền dải, cùng lý do ở ② */
#trQuy .quy-tq-the::before{content:""; position:absolute; left:0; top:13px; bottom:13px; width:1px; background:var(--line)}
/*   màn rộng, 3 cột: ô đầu mỗi hàng không có thanh dọc · hàng đầu không có kẻ ngang */
#trQuy .quy-tq-the:nth-child(3n+1){padding-left:0}
#trQuy .quy-tq-the:nth-child(3n+1)::before{display:none}
#trQuy .quy-tq-the:nth-child(-n+3){border-top:0}
@media (max-width:900px){   /* màn vừa, 2 cột */
  #trQuy .quy-tq-the:nth-child(n){padding-left:16px; border-top:1px solid var(--line)}
  #trQuy .quy-tq-the:nth-child(n)::before{display:block}
  #trQuy .quy-tq-the:nth-child(2n+1){padding-left:0}
  #trQuy .quy-tq-the:nth-child(2n+1)::before{display:none}
  #trQuy .quy-tq-the:nth-child(-n+2){border-top:0}
}
@media (max-width:560px){   /* điện thoại, 1 cột: chỉ còn kẻ ngang */
  #trQuy .quy-tq-the:nth-child(n){padding-left:0}
  #trQuy .quy-tq-the:nth-child(n)::before{display:none}
  #trQuy .quy-tq-the:nth-child(2){border-top:1px solid var(--line)}
}
/* ④ HAI KHUNG NẰM CẠNH NHAU CÁCH NHAU 8px — bằng bảng ↔ biểu đồ ở trang Chỉ số (luật 5 của File-MD/mau-giao-dien-khung-bieu-do-v1.md). Trước là 22px (`.quy-tang`)
   và 14px. Ba cặp: bảng ↔ biểu đồ · hai bánh vòng · thẻ ô số ↔ thẻ danh sách bên phải (cả ở tab Dòng tiền). Màn hẹp hai khung xếp chồng thì cũng cách 8px, y trang Chỉ số. */
#trQuy .quy-tang, #trQuy .quy-hai-banh, #trQuy .quy-ndt-hai{gap:8px}
/* ⑤ ĐẦU TRANG CHI TIẾT THÀNH VIÊN GỌN CÒN 2 DÒNG (donviquy.js #46 dựng khung `.quy-member-headline`): hàng 1 = tên + nhãn "Đã rút hết" + dòng vai trò;
   hàng 2 = tài khoản · số điện thoại. Bó dưới `#quyNdtChiTiet` ⇒ đầu tab Dòng tiền (dùng chung `.quy-ndt-dau`, vòng tròn 48px) KHÔNG đổi. */
#trQuy #quyNdtChiTiet .quy-tron.quy-tron-lon{width:40px; height:40px; font-size:14px}
#trQuy .quy-member-headline{display:flex; align-items:baseline; flex-wrap:wrap; gap:0 12px; white-space:normal}
/*   Hàng 2 nay dài hơn (thêm số điện thoại) ⇒ màn điện thoại cho xuống dòng thay vì tràn ra ngoài thẻ. Ngoài mẫu: mẫu chỉ vẽ màn rộng. */
#trQuy #quyNdtChiTiet .quy-ndt-email{white-space:normal; overflow-wrap:anywhere}
/*   Dòng xám "chưa gắn tài khoản …" mang lớp `.quy-chu-mo` nên dính lề 14px 16px của câu báo (thụt vào, cách xa tên) ⇒ gỡ lề cho hàng 2 sát dưới tên, y như lúc đã gắn email. */
#trQuy #quyNdtChiTiet .quy-ndt-email.quy-chu-mo{margin:0}

/* (#119) TRANG QUỸ — HAI HÀNG LÃI KIỂU TAB GIAO DỊCH + DẢI "GIÁ 1 ĐVQ QUA CÁC KỲ" (thợ ngầm của «dbe08d84», anh gật mẫu 21:10 05/10 — Mockups/mockup-quy-tong-quan-dong-ho-v1.html)
   Dùng lại Ô SỐ `.quy-o-so` + mẹo thanh dọc mờ của ② (lưới dịch trái 14px rồi cắt) ⇒ chỉ thêm khung dải + số cột. Khối này đứng TRƯỚC khối (#117) vì bài test_the_chandoan_117.js đòi (#117) là khối cuối tệp.
   · `.quy-figure-band`  = khung dải góc vuông nền trắng ở tab Tổng quan (đệm trái 14px = đúng số dịch trái của lưới ②). Góc vuông = KHÔNG khai bo tròn nào trong khối này
     (bài test_giao_dien_goc_vuong.js kiểm kê mọi khai báo bo tròn của tệp — thêm một khai báo là phải xếp loại ở bài đó). Hai khung cách nhau 8px (luật ④).
   · `.quy-figure-grid`  = lưới 6 ô một hàng; `.quy-figure-five` 5 ô; `.quy-figure-periods` 6 kỳ (số ngắn nên giữ 6 cột lâu hơn). KHÔNG bó max-width.
   · Số trong dải nhỏ hơn ô Thành tích (16px thay 20px) để 6 ô đứng vừa một hàng; số dài được xuống dòng trong ô ⇒ không đẩy ngang cả trang ở màn hẹp. */
#trQuy .quy-figure-title{display:flex; align-items:baseline; flex-wrap:wrap; gap:4px 8px; margin:12px 0 8px; font-size:13.5px; font-weight:600}
#trQuy .quy-figure-band{margin:0 0 8px; padding:2px 14px; background:var(--panel); border:1px solid var(--line); min-width:0}
#trQuy .quy-member-profit{margin-bottom:8px}
#trQuy .quy-figure-grid{grid-template-columns:repeat(6, minmax(0, 1fr))}
#trQuy .quy-figure-grid.quy-figure-five{grid-template-columns:repeat(5, minmax(0, 1fr))}
/*   Hàng 2 nằm sát dưới hàng 1 trong cùng một thẻ (tab Thành viên) ⇒ KHÔNG cắt mép trên, giữ kẻ ngang mờ ngăn hai hàng. */
#trQuy .quy-figure-grid + .quy-figure-grid{clip-path:inset(0 -999px 0 14px)}
#trQuy .quy-figure-grid .quy-o-so b{font-size:16px; font-weight:600; white-space:normal; overflow-wrap:anywhere}
#trQuy .quy-figure-grid .quy-o-so > span{font-size:12.5px}
#trQuy .quy-figure-grid .quy-o-so small{font-size:12px}
/*   Chữ thay số: "Đã thu hồi hết vốn" (xám, nhỏ hơn số — như tab Giao dịch) · PWHM bằng 0 (mờ). Bộ chọn có `b` để thắng luật `.quy-o-so b span` của khối #91. */
#trQuy .quy-o-so b .quy-figure-text{font-size:14px; font-weight:500; color:var(--dim)}
#trQuy .quy-o-so b .quy-figure-muted{color:var(--dim2)}
@media (max-width:1200px){
  #trQuy .quy-figure-grid, #trQuy .quy-figure-grid.quy-figure-five{grid-template-columns:repeat(3, minmax(0, 1fr))}
  #trQuy .quy-figure-grid.quy-figure-periods{grid-template-columns:repeat(6, minmax(0, 1fr))}
}
@media (max-width:900px){ #trQuy .quy-figure-grid.quy-figure-periods{grid-template-columns:repeat(3, minmax(0, 1fr))} }
@media (max-width:560px){
  #trQuy .quy-figure-grid, #trQuy .quy-figure-grid.quy-figure-five, #trQuy .quy-figure-grid.quy-figure-periods{grid-template-columns:repeat(2, minmax(0, 1fr))}
  #trQuy .quy-figure-grid .quy-o-so b{font-size:14px}
}

/* (#122) Ô SỐ THẲNG HÀNG TRÊN MỘT LƯỚI 6 CỘT — trang Quỹ + hộp "Danh mục của tôi" (thợ ngầm của «dbe08d84», anh gật mẫu 23:37 + phần C 23:42 05/10 — Mockups/mockup-quy-o-so-thang-hang-v1.html).
   Chỉ THÊM, chỉ đổi BỐ CỤC. Khối này đứng SAU khối (#119) và TRƯỚC khối (#120): bài test_chi_so_gon_265 (S6) cấm luật `.tomtat` / `.dongtien` viết sau khối (#120); các luật dưới đây
   không khai lại thuộc tính nào khối (#120) đã khai (thanh dọc, kẻ ngang, đệm ô giữ nguyên của #120). Không khai bo tròn, không bó max-width, không đổi cỡ chữ số.
   A. TRANG QUỸ — thẻ từng thành viên (donviquy.js #50): bốn hàng `.quy-figure-grid` trong MỘT thẻ, mỗi hàng có tiêu đề nhỏ `.quy-figure-row-title`.
      · `.quy-figure-wide` = ô chiếm 2 cột (ô "⇒ Nhận về"). Lưới 6 → 3 → 2 cột: 5 ô (4 + ô rộng) luôn lấp kín hàng ⇒ không tràn, không hở ô.
      · Dải "Nếu rút hết hôm nay" (`#quyNdtRutHet.quy-rut-gon`) nay là MỘT HÀNG của thẻ: gỡ khung vàng + kiểu xếp ngang của dải cũ, giữ màu vàng của tiêu đề (luật `.quy-rg-tt` cũ). */
#trQuy .quy-figure-wide{grid-column:span 2}
#trQuy .quy-figure-row-title, #trQuy .quy-member-profit .quy-rut-gon .quy-rg-tt{display:flex; align-items:baseline; flex-wrap:wrap; gap:4px 8px; margin:12px 0 8px; font-size:13.5px; font-weight:600}
#trQuy .quy-member-profit .quy-rut-gon{display:block; margin:0; padding:0; border:0; background:none; font-size:inherit}
#trQuy .quy-member-profit .quy-rut-gon > span{display:block; padding-bottom:4px; font-size:13.5px; color:var(--dim)}
#trQuy .quy-member-profit .quy-figure-wide.tong b{color:var(--up)}
#trQuy #quyNdtChiTiet > .quy-manager-reward{margin:0 0 8px}
/* C. HỘP "DANH MỤC CỦA TÔI" (portfolio.js KHÔNG đổi — thuần CSS, bó trong hộp `#trGiaodich` là nơi duy nhất portfolio.js vẽ `.tomtat` / `.dongtien`): bốn hàng chung lưới 6 cột.
      · `.tomtat` thôi tự chia cột (`auto-fit`) ⇒ 6 cột cố định; hàng "Cách B" (dải `.tomtat` đứng ngay sau nhãn `.tomtat-nhan`) giữ 4 ô, hai ô cuối mỗi ô rộng 2 cột.
      · `.dongtien` từ hàng ngang thành lưới 6 cột: nhãn ở cột 1, mỗi mục một cột, chữ `<i>` trên số `<b>` dưới; mục CUỐI lấp phần cột còn lại — đếm bằng số con của dải
        (nhãn + 3…5 mục ⇒ 4…6 con), portfolio.js không phải đếm. Màn ≤ 1200px: 3 cột, nhãn chiếm trọn hàng đầu; ≤ 560px: 2 cột; ≤ 420px ô số `.tomtat` về 1 cột như trước nay
        (số 24px không đứng vừa nửa màn điện thoại). Hàng thiếu ô vẫn có kẻ ngang trọn dải nhờ vạch `::after` của khối (#120). */
#trGiaodich .tomtat{grid-template-columns:repeat(6, minmax(0, 1fr))}
#trGiaodich .tomtat-nhan + .tomtat > .o:nth-child(n+3){grid-column:span 2}
#trGiaodich .dongtien{display:grid; grid-template-columns:repeat(6, minmax(0, 1fr))}
#trGiaodich .dongtien > span{flex-direction:column; align-items:flex-start; gap:4px; min-width:0}
#trGiaodich .dongtien > .nhan{flex-direction:row; align-items:center; gap:6px}
#trGiaodich .dongtien > span:last-child:nth-child(4){grid-column:span 3}
#trGiaodich .dongtien > span:last-child:nth-child(5){grid-column:span 2}
@media (max-width:1200px){
  #trGiaodich .tomtat, #trGiaodich .dongtien{grid-template-columns:repeat(3, minmax(0, 1fr))}
  #trGiaodich .tomtat-nhan + .tomtat > .o:nth-child(n+3){grid-column:auto}
  #trGiaodich .dongtien > .nhan{grid-column:1 / -1}
  #trGiaodich .dongtien > span:last-child:nth-child(4){grid-column:auto}
  #trGiaodich .dongtien > span:last-child:nth-child(5){grid-column:span 3}
  #trGiaodich .dongtien > span:last-child:nth-child(6){grid-column:span 2}
}
@media (max-width:560px){
  #trGiaodich .tomtat, #trGiaodich .dongtien{grid-template-columns:repeat(2, minmax(0, 1fr))}
  #trGiaodich .dongtien > span:last-child:nth-child(4), #trGiaodich .dongtien > span:last-child:nth-child(6){grid-column:span 2}
  #trGiaodich .dongtien > span:last-child:nth-child(5){grid-column:auto}
}
@media (max-width:420px){ #trGiaodich .tomtat{grid-template-columns:minmax(0, 1fr)} }

/* (#120) TRANG CHỈ SỐ GỌN LẠI («3059dba8», anh giao 21:18–21:34, gật 21:37 05/10/2026; đi cặp index.html #265 · taifu.js #90). Chỉ THÊM, không sửa luật cũ nào.
   Khối này đứng TRƯỚC khối (#117) vì bài test_the_chandoan_117 đòi (#117) là khối có dấu mốc cuối tệp; các luật dưới đây không trùng bộ chọn nào của (#117).
   ① HỘP DANH MỤC — hai hàng ô số `.tomtat` (6 ô + 4 ô "Cách B") và hai dải `.dongtien` (VND, USDT): bỏ khung bao từng ô, cả hàng là MỘT dải nền trắng viền mảnh; giữa các số là
      thanh dọc mờ, rớt hàng thì các hàng ngăn nhau bằng kẻ ngang mờ — cùng kiểu ô số trang Quỹ (khối #116 ② ③). Lưới `.tomtat` tự chia cột (`auto-fit`) nên KHÔNG đếm ô được:
      thanh dọc vẽ ở `left:-1px` (lọt ra ngoài mép trái ô) + kẻ ngang là vạch 1px ở mép trên ô (xem dưới); dải cắt phần thò ra (`overflow:hidden`) ⇒ ô đầu mỗi hàng tự mất thanh dọc,
      hàng đầu tự mất kẻ ngang, đúng ở mọi số cột. Màu lấy từ `--line` ⇒ nền tối tự theo. Ô `.o` đứng riêng (dòng "Đang tải…", "Chưa có danh mục") KHÔNG đổi. */
.tomtat{gap:0; background:var(--panel); border:1px solid var(--line); overflow:hidden}
.tomtat > .o{border:0; box-shadow:none; background:transparent; padding:14px 18px}
.tomtat > .o::before{content:""; position:absolute; left:-1px; top:15px; bottom:15px; width:1px; background:var(--line)}
/*   Kẻ ngang = vạch 1px ở mép trên MỖI ô, kéo dài hết bề ngang dải (`left / right:-100vw`, dải cắt phần thừa) ⇒ hàng rớt chỉ có 1–2 ô thì kẻ vẫn chạy trọn dải, không cụt
     (soát lỗi 05/10: vẽ bằng bóng của từng ô thì hàng thiếu ô kẻ chỉ dài bằng số ô có thật). Vạch của hàng đầu nằm trên mép trong của dải ⇒ bị cắt, không hiện. */
.tomtat > .o::after, .dongtien > span::after{content:""; position:absolute; left:-100vw; right:-100vw; top:-1px; height:1px; background:var(--line)}
.dongtien{gap:0; padding:0; align-items:stretch; overflow:hidden; box-shadow:none}
.dongtien > span{position:relative; padding:13px 18px}
.dongtien > span::before{content:""; position:absolute; left:-1px; top:12px; bottom:12px; width:1px; background:var(--line)}
.dongtien .nhan{border-right:0; padding-right:18px}
@media (max-width:760px){ .dongtien .nhan{padding:11px 18px; border-bottom:0} }   /* nhãn chiếm trọn hàng đầu; kẻ ngang dưới nó do bóng 1px của hàng số kế tiếp lo */
/* ② HÀNG NÚT KHU #3 — nút ⛶ `#khu3Full` thôi dạt sang mép phải (luật `.khu3-full{margin-left:auto}` của #24), đứng NGAY SAU hai nút chế độ, TRƯỚC dấu "?". Dấu "?" nằm trong
      `#tfCheDo` (taifu.js bật / tắt cả cụm bằng `style.display`) ⇒ cho cụm đó "tan" vào hàng (`display:contents`) rồi xếp thứ tự bằng `order`; taifu.js đặt `display:none` viết thẳng
      thì vẫn thắng luật này ⇒ xem chỉ số (không phải danh mục) thì hàng chỉ còn nút ⛶. */
#tfTab3 #tfCheDo{display:contents}
#tfTab3 #tfCheDo > .toggle-group{order:1}
#tfTab3 #khu3Full{order:2; margin-left:0}
#tfTab3 #tfCheDo > .tf-cd-hoi{order:3}
#tfTab3 #tfTab3Msg{order:4}
/* ③ Hai khối mang `hidden` trong index.html #265 phải được giấu ở tầng author (luật `display` của `.th-tang` / `.tf-sec-tt` nặng hơn `[hidden]` của trình duyệt). */
#tfBang2Head[hidden], #thTang3[hidden]{display:none}
/* ④ BIỂU ĐỒ USDT PHÓNG TO (`congcuve.js` gắn `cv-full` lên thẻ `#chart-card`): chỉ hàng nút + biểu đồ chiếm màn hình, khối số liệu `#mkTren` ẩn; thu lại thì hiện như cũ. */
#chart-card.cv-full #mkTren{display:none}
/*   Nút › của khu #4 đã gỡ ⇒ tiêu đề "Chỉ số thị trường" thôi chừa 42px bên trái cho nút (luật cũ ở khối B1). */
#trTaifu .th-4 #usdtSectionTitle{padding-left:0}

/* (#117) TAB CHẨN ĐOÁN — THẺ "GIÁ TRỊ HIỆN TẠI" GỌN LẠI («3059dba8», anh giao 12:42 05/10)
   Đo trang thật V258, màn 1536px: thẻ trái 503px, hai thẻ kia 475px, hàng bánh tròn ngay dưới 484px × 3 ⇒ mép ô hai hàng không thẳng nhau;
   khối chữ cao 271px dính mép trên, thẻ bị kéo cao theo thẻ bánh vòng thì hở trống ở đáy. Khối này chỉ THÊM, đứng cuối file nên thắng luật cũ. */
/* Ba cột đều KHI ĐỦ CHỖ; cột trái giữ sàn `min-content` ⇒ số dài (VND cỡ tỷ) ở cửa sổ ~1000–1150px thì cột trái tự nở như luật 1.06fr cũ, không để con số đè lên cột chồng. Luật màn hẹp phải nhắc lại vì khối này đứng sau luật ≤1000px cũ. */
#trChanDoan .cd-hang3{grid-template-columns:minmax(min-content,1fr) minmax(0,1fr) minmax(0,1fr)}
@media (max-width:1000px){ #trChanDoan .cd-hang3{grid-template-columns:minmax(0,1fr)} }
/* Khối chữ nằm giữa thẻ theo chiều dọc — như cột chồng bên cạnh và hai thẻ kia (`.cd-canh`). */
#trChanDoan .cd-so-khoi{align-self:center}
/* Bớt khoảng cách dòng; cỡ chữ giữ nguyên. */
#trChanDoan .cd-so-lon{line-height:1.15; overflow-wrap:break-word}
#trChanDoan .cd-qq-hop{margin-top:8px; padding-top:6px}
#trChanDoan .cd-qq-dong{margin:1px 0; line-height:1.35}
/* Cột nay hẹp hơn 1.06fr cũ và không tự nở theo chữ ⇒ con số dài (VND) ở cửa sổ ~1000–1100px được xuống hàng thay vì tràn sang cột chồng. */
#trChanDoan .cd-giavon{margin-top:6px; padding-top:6px; white-space:normal; overflow-wrap:anywhere}

/* ============================================================
   (#123) TRANG QUỸ — Ô "TỔNG GIÁ TRỊ" CỦA BẢN THÀNH VIÊN (anh gật 00:04 06/10/2026): thay tiêu đề "Chỉ số & Thành viên".
   Dòng nhãn nhỏ · số lớn · ô xanh / đỏ mức đổi 24 giờ (donviquy.js #51 `drawOwnTotal`). Màn hẹp: số nhỏ lại, ô rớt xuống dòng.
   Màu lấy từ biến sẵn có (--up / --down) ⇒ chế độ tối tự theo.
   ============================================================ */
#trQuy .quy-own-total{margin:2px 20px 14px}
/* (#126) Nhịp 1b — dòng nhãn "Chỉ xem" đầu trang Quỹ của nhóm Quản lý (index #281 `#quyReadOnlyNote`, donviquy.js #53 bật). Chữ nhỏ, không khung; nhãn dùng `.quy-nhan-xam` sẵn có. Ẩn nhờ `#trQuy [hidden]`. */
#trQuy .quy-read-only-note{margin:2px 20px 10px; font-size:13px; color:var(--dim)}
#trQuy .quy-read-only-note .quy-nhan-xam{margin-right:6px}
#trQuy .quy-own-view .tt-giu-cho{display:none}   /* bản thành viên không còn tiêu đề bảng trái ⇒ khung biểu đồ khỏi giữ chỗ */
#trQuy .quy-own-total-label{font-size:14px; font-weight:700; color:var(--txt)}
#trQuy .quy-own-total-row{display:flex; align-items:center; flex-wrap:wrap; gap:6px 14px; margin-top:4px}
#trQuy .quy-own-total-value{font-size:38px; font-weight:800; line-height:1.15; letter-spacing:-.02em; color:var(--txt); font-variant-numeric:tabular-nums}
#trQuy .quy-own-total-change{display:inline-block; padding:5px 12px; border-radius:999px; font-size:14px; font-weight:600; white-space:nowrap}
#trQuy .quy-own-total-change.len{color:var(--up); background:color-mix(in srgb, var(--up) 12%, transparent)}
#trQuy .quy-own-total-change.xuong{color:var(--down); background:color-mix(in srgb, var(--down) 12%, transparent)}
@media (max-width:560px){
  #trQuy .quy-own-total{margin-left:12px; margin-right:12px}
  #trQuy .quy-own-total-value{font-size:28px}
  #trQuy .quy-own-total-change{font-size:13.5px; padding:4px 10px}
}

/* ============================================================
   (#124) BỐ CỤC CÀI ĐẶT (`st-`) + MÀN QUẢN TRỊ THEO NHÓM (`gr-`) — Đợt 1 "Quản trị theo nhóm" (cửa sổ «d5a8333c», anh gật 12:54 06/10/2026;
   mẫu Mockups/mockup-cai-dat-va-quan-tri-v1.html, hai khối đánh dấu "PHẦN SẼ VÀO style.css"). Chỉ THÊM, không sửa luật cũ nào.
   Khung, bảng, hộp nổi (`.st-panel`, `.gr-table`, `.gr-menu`) VUÔNG. Chỗ bo tròn mới (ô nhập, nút, nhãn viên thuốc) đã khai ở danh sách GIU +
   SAU_MOC_GIU của File-Test/test_giao_dien_goc_vuong.js — thêm chỗ bo tròn nữa vào khối này mà không khai thì bài đó đỏ.
   Màu lấy từ biến sẵn có ⇒ chế độ tối tự theo.
   ============================================================ */
/* ----- Bố cục cài đặt ----- */
.st-page h2{margin:4px 0 2px; font-size:20px}
.st-page > .st-lead{margin:0 0 12px; font-size:13.5px; color:var(--dim)}
.st-panel{border:1px solid var(--line); background:var(--panel); padding:4px 20px 14px}
.st-panel + .st-panel{margin-top:8px}
.st-section{padding:14px 0 6px; border-top:2px solid var(--line)}
.st-section:first-child{border-top:0}
.st-section > h3{margin:0 0 2px; font-size:15px}
.st-section > .st-lead{margin:0 0 6px; font-size:13.5px; color:var(--dim)}
.st-row{display:grid; grid-template-columns:210px minmax(0,1fr); column-gap:18px; padding:7px 0; align-items:start}
.st-label{font-size:14px; font-weight:600; color:var(--txt); padding-top:7px}
.st-field input[type="text"], .st-field input[type="password"], .st-field input[type="email"], .st-field select, .st-field textarea{font:inherit; font-size:14px; font-weight:400; color:var(--txt); background:var(--panel); border:1px solid var(--line); border-radius:6px; padding:6px 10px; width:100%; max-width:300px; box-sizing:border-box}
.st-field textarea{max-width:460px; min-height:64px; resize:vertical}
.st-field input[readonly]{background:transparent; color:var(--dim)}
.st-hint{margin:4px 0 0; font-size:13.5px; line-height:1.45; color:var(--dim); max-width:620px}
.st-value{font-size:14px; padding-top:7px}
.st-actions{display:flex; gap:8px; flex-wrap:wrap; align-items:center}
.st-page .dn-nut, .st-solo .dn-nut{width:auto; padding:7px 16px; font-size:14px; border-radius:6px}
.st-toggle{display:flex; gap:8px; align-items:flex-start; font-size:14px; padding-top:6px}
.st-toggle input{width:16px; height:16px; accent-color:var(--cool); flex:none; margin-top:2px}
.st-badge{display:inline-block; font-size:13px; padding:2px 9px; border-radius:999px; border:1px solid var(--up); color:var(--up); margin-left:8px; font-weight:400}
.st-list-row{display:flex; gap:10px; align-items:center; flex-wrap:wrap; padding:8px 0; border-bottom:1px solid var(--line); font-size:14px; max-width:760px}
.st-list-row:last-child{border-bottom:0}
.st-list-row .st-grow{flex:1 1 220px}
.st-list-row small{display:block; color:var(--dim); font-size:13px}
.st-solo{max-width:640px}
@media (max-width:640px){
  .st-row{grid-template-columns:minmax(0,1fr)}
  .st-label{padding-top:0; margin-bottom:4px}
  .st-field input, .st-field select, .st-field textarea{max-width:none}
}

/* ----- Màn Quản trị ----- */
.gr-head{display:flex; gap:10px; align-items:baseline; flex-wrap:wrap; padding-top:12px}
.gr-head h3{margin:0; font-size:15px}
.gr-lead{margin:2px 0 10px; font-size:13.5px; color:var(--dim)}
.gr-table{width:100%; min-width:0; border-collapse:collapse; font-size:13.5px}
.gr-table th{text-align:left; font-size:12.5px; letter-spacing:.5px; text-transform:uppercase; color:var(--dim); padding:7px 10px; border-bottom:1px solid var(--line)}
.gr-table td{padding:8px 10px; border-bottom:1px solid var(--line); vertical-align:middle}
.gr-table tr:last-child td{border-bottom:0}
.gr-table .mid{text-align:center}
.gr-table .num{text-align:right; font-variant-numeric:tabular-nums}
.gr-table tr.sep td{background:transparent; font-size:12.5px; letter-spacing:.5px; text-transform:uppercase; color:var(--dim); padding:5px 10px}
.gr-yes{color:var(--up); font-weight:700}
.gr-no{color:var(--dim)}
.gr-own{color:var(--cool); font-weight:600}
.gr-ok{color:var(--up); font-weight:700; margin-left:4px}
.gr-miss{color:var(--dim); font-size:13px; margin-left:4px}
.gr-pill{display:inline-block; font-size:13px; padding:2px 9px; border-radius:999px; border:1px solid var(--line); color:var(--dim); white-space:nowrap}
.gr-pill.fund{border-color:var(--up); color:var(--up)}
.gr-pill.lock{border-color:var(--down); color:var(--down)}
.gr-pill.mgr{border-color:var(--cool); color:var(--cool)}
.gr-pill.own{border-color:var(--gold); color:var(--gold)}
a.gr-pill{text-decoration:none; cursor:pointer}
.gr-select{font:inherit; font-size:13.5px; padding:4px 8px; border:1px solid var(--line); border-radius:6px; background:var(--panel); color:var(--txt)}
.gr-tools{display:flex; gap:8px; flex-wrap:wrap; align-items:center; margin:0 0 10px}
.gr-tools input{font:inherit; font-size:14px; padding:6px 10px; border:1px solid var(--line); border-radius:6px; background:var(--panel); color:var(--txt); width:260px; max-width:100%}
.gr-count{font-size:13.5px; color:var(--dim); margin-left:auto}
.gr-btn{all:unset; cursor:pointer; font-size:13.5px; font-weight:600; padding:5px 12px; border-radius:6px; border:1px solid var(--cool); color:var(--cool); white-space:nowrap}
.gr-btn.red{border-color:var(--down); color:var(--down)}
.gr-btn.solid{background:var(--cool); color:#fff}
.gr-scroll{overflow-x:auto}
.gr-more td{background:transparent; padding:0 10px 12px}
.gr-menu{border:1px solid var(--line); background:var(--panel); box-shadow:0 6px 18px rgba(0,0,0,.14); font-size:13.5px; white-space:normal; display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); position:sticky; left:0; width:min(100%, calc(100vw - 84px)); box-sizing:border-box}
.gr-menu div{padding:9px 12px; border-right:1px solid var(--line)}
.gr-menu div:last-child{border-right:0}
.gr-menu div[role="button"]{cursor:pointer}
.gr-menu div.off{cursor:default}
.gr-list{min-width:780px}
.gr-list td{white-space:nowrap}
.gr-list td.wrap{white-space:normal; min-width:180px}
.gr-list .gr-miss{display:block; margin-left:0}
.gr-roles{min-width:760px}
.gr-menu div b{color:var(--cool)}
.gr-menu div.off b{color:var(--dim)}
.gr-menu small{display:block; font-size:13px; color:var(--dim); margin-top:2px}
details.gr-fold > summary{cursor:pointer; font-size:15px; font-weight:700; padding:12px 0 6px}
/* form hỏi lại xác minh nằm trong hàng phụ của bảng tài khoản · danh sách lịch sử đăng nhập */
.gr-confirm{display:flex; gap:8px; flex-wrap:wrap; align-items:center; padding:10px 12px; border-top:1px solid var(--line)}
.gr-confirm input{font:inherit; font-size:14px; padding:6px 10px; border:1px solid var(--line); border-radius:6px; background:var(--panel); color:var(--txt); width:200px; max-width:100%}
.gr-history{font-size:13.5px; padding:10px 12px; border-top:1px solid var(--line)}
.gr-history div{padding:2px 0}
/* Ô Turnstile của form hỏi lại (nav.js tự tạo) và dòng báo lỗi chiếm trọn một hàng dưới hai ô nhập */
.gr-confirm > b, .gr-confirm > .dn-loi, .gr-confirm > div{flex:1 1 100%}
/* Thực đơn ⋯ rộng theo KHUNG CUỘN của bảng chứ không theo cả màn hình: trang thật có thực đơn trái nên `100vw - 84px` của bản mẫu
   làm mục cuối tràn khỏi khung khi bảng rộng hơn khung (đo Chrome 1400px, 06/10). `20px` = hai bên đệm của ô chứa thực đơn. */
.gr-scroll{container-type:inline-size}
.gr-menu{width:min(100%, calc(100cqw - 20px))}
.gr-confirm, .gr-history{position:sticky; left:0; width:min(100%, calc(100cqw - 20px)); box-sizing:border-box}
/* Ô link vừa cấp giãn theo khung thay vì bó 260px của ô tìm */
.qt-link-hang.gr-tools input{flex:1 1 320px; width:auto}
/* Màn Quản trị co giãn hết bề ngang như hai màn kia (bảng 7 cột); luật cũ `.qt-trang{max-width:1000px}` để yên */
#trQuanTri .wrap{max-width:none}
/* Nhãn bấm được (`<label for>`) trong cột nhãn giữ đúng dáng chữ của cột; câu báo trong cột ô nhập cách ô một khe */
.st-label label{font:inherit; color:inherit; cursor:pointer}
.st-field .dn-loi, .st-field .tk-ok{margin:6px 0; max-width:460px}
/* Cài đặt quỹ (donviquy.js `dungCd` / `portfolioRow` vỏ mới): dòng "đã có lệnh" mờ đi · câu báo không thụt lề, rỗng thì không chiếm chỗ */
#trCaiDatQuy .st-list-row.dimmed{opacity:.5}
#trCaiDatQuy .st-section .quy-chu-mo, #trCaiDatQuy .st-section .quy-loi{margin:8px 0; font-size:14px}
#trCaiDatQuy .st-section .quy-chu-mo:empty{display:none}
/* Nút "Gắn vào quỹ": dòng đổi lớp sang `st-list-row` nên luật cỡ cũ `#trCaiDatQuy .quy-portfolio-row .quy-nut-nho` hết khớp ⇒ khai lại đúng cỡ đó */
#trCaiDatQuy .st-list-row .quy-nut-nho{font-size:13.5px; padding:5px 12px}
/* Form hỏi lại xác minh + lịch sử đăng nhập nằm trong ô bảng `nowrap` ⇒ trả lại xuống dòng (màn hẹp tiêu đề form từng bị cắt cụt) */
.gr-confirm, .gr-history{white-space:normal}
/* Bảng Tài khoản / Chờ duyệt vừa khung hơn (đo 1280: khung 904, bảng từng rộng 1200–1520):
   · Họ tên + Email được xuống dòng (email dài gãy ở bất kỳ chữ nào) · giờ đăng nhập cuối gãy thành ngày / giờ khi chật
   · ô nút cuối dòng: nhãn trạng thái nằm riêng một hàng, nút được gãy dòng
   · còn phải cuộn ngang (điện thoại) thì cột Họ tên GHIM bên trái ⇒ luôn biết nút đang bấm thuộc về ai */
.gr-list tr:not(.gr-more) > td:first-child{white-space:normal; overflow-wrap:anywhere; min-width:96px; max-width:240px}   /* (#129) tên = email dài (tài khoản Google chưa đặt tên) từng tràn đè cột Email: cho gãy dòng + nới trần 170 → 240 để màn rộng nằm trọn một dòng */
.gr-list tr:not(.gr-more) > td:nth-child(2){white-space:normal; overflow-wrap:anywhere; min-width:150px; max-width:240px}
.gr-list tr:not(.gr-more) > td:nth-child(6), .gr-list tr:not(.gr-more) > td:last-child{white-space:normal}
.gr-list td:last-child > .gr-pill{display:block; width:max-content; margin:0 0 4px}
.gr-list td:last-child > .gr-btn{display:inline-block; margin:2px 0}
.gr-list tr:not(.gr-more) > td:first-child, .gr-list th:first-child{position:sticky; left:0; z-index:1; background:var(--panel)}

/* ----- (#127) Thực đơn ⋯ NHỎ của bảng Tài khoản + khu "Đã xoá" (anh duyệt 20:35 10/10) -----
   Hộp thả xuống dùng lại khuôn `.quy-menu` của trang Quỹ (góc vuông, mỗi việc một dòng, chữ đỏ = việc nguy hiểm, `.quy-menu-plain` = chữ thường).
   NỔI theo toạ độ nút ⋯ (nav.js `placeAccountMenu`) và nằm trong `#qtAccountMenuHost` ngoài `.gr-scroll` ⇒ dòng cuối / màn hẹp không bị bảng cắt.
   Việc chưa đủ điều kiện: `aria-disabled` ⇒ mờ, lý do ở `title`. Không khai bo góc nào. Luật `.gr-menu` cũ (hàng phụ dàn ngang) không còn nơi dùng, để yên. */
#qtAccountMenuHost .quy-menu.gr-dropdown{position:fixed; right:auto; top:auto; left:8px; z-index:900; max-width:calc(100vw - 16px); max-height:calc(100vh - 16px); overflow-y:auto; box-sizing:border-box}
/* (#129) Nút ⋯ cuối dòng: hình chữ nhật viền xám nhạt, ba chấm màu chữ (anh gửi hình 13:33 11/10) — đè màu tím của `.gr-btn` */
.gr-btn.gr-menu-toggle{min-width:20px; text-align:center; font-size:15px; line-height:20px; border-color:var(--line); color:var(--txt); background:var(--panel)}
.gr-btn.gr-menu-toggle:hover, .gr-btn.gr-menu-toggle[aria-expanded="true"]{background:var(--line-soft)}
.gr-btn.gr-menu-toggle:focus-visible{outline:2px solid var(--cool); outline-offset:1px}
.quy-menu.gr-dropdown button{font-size:13.5px; white-space:nowrap}
.quy-menu.gr-dropdown button:hover, .quy-menu.gr-dropdown button:focus-visible{background:var(--line-soft)}
.quy-menu.gr-dropdown button:focus-visible{outline:2px solid var(--cool); outline-offset:-2px}
.quy-menu.gr-dropdown button[aria-disabled="true"]{color:var(--dim2); cursor:not-allowed; background:transparent}
/* Câu hậu quả trong form hỏi lại (vd "Không hoàn tác được…") · nút Đóng của lịch sử đăng nhập */
.gr-confirm > .gr-confirm-note{flex:1 1 100%; font-size:13.5px; color:var(--down)}
.gr-more .gr-history-close{display:inline-block; margin:0 12px}
/* Khu "Đã xoá": bảng 2 cột, mã tài khoản dài được gãy dòng ở màn hẹp */
.gr-deleted td:first-child{overflow-wrap:anywhere}
#qtDeletedCount{font-weight:400; color:var(--dim)}

/* ----- Thực đơn trái (góc vuông của `.tk-ben a` khai trong khối #116) ----- */
.tk-ben a{padding:10px 12px}
.tk-ben a[aria-current="page"]{background:var(--panel)}
#tkBenPendingCount{display:inline-block; margin-left:4px; padding:0 6px; font-size:12.5px; font-weight:600; color:var(--down); border:1px solid var(--down); border-radius:999px}
#tkBenPendingCount[hidden]{display:none}

/* ----- (#59) Thưởng người giới thiệu (anh duyệt 10:38 17/10/2026): nhãn "Thưởng" của Dòng thời gian · cột "Người giới thiệu" (ô chọn trên, ô % dưới).
   Góc vuông; nhãn nhỏ giữ bo như nhãn khác. (#135, anh duyệt 12:30 17/10) BỎ nền xanh cả dòng — thay bằng nhãn "Góp" màu ô tên viết tắt `.quy-tron`. ----- */
.quy-nhan-gop.quy-nhan-gop-referral, #trQuy .quy-nhan-gop.quy-nhan-gop-referral{background:var(--cool-soft); color:var(--cool)}
.quy-referral-hint{display:block; font-size:12px; white-space:normal; max-width:240px}
.quy-cd-referral{display:flex; gap:8px; align-items:center; max-width:300px}
.st-field .quy-cd-referral input[type="text"]{max-width:120px}
.quy-nhan-thuong{display:inline-block; font-size:12px; font-weight:600; padding:1px 8px; border-radius:10px; white-space:nowrap; background:color-mix(in srgb, var(--cool) 14%, transparent); color:var(--cool)}
#trQuy .quy-nhan-thuong{font-size:13px; padding:3px 10px; border-radius:999px}
.quy-referral-cell{white-space:nowrap}
.quy-referral-draft{display:flex; flex-direction:column; gap:4px}
#trQuy tr.quy-dt-nhap .quy-referral-draft select, .quy-referral-draft select{width:auto; min-width:160px; max-width:240px; border-radius:0}
#trQuy tr.quy-dt-nhap .quy-referral-draft input, .quy-referral-draft input{min-width:0; width:64px; border-radius:0}

/* ----- Thuộc tính `hidden`: trang thật không có luật `[hidden]` toàn cục ⇒ lớp nào tự đặt `display` phải có dòng này, không thì `hidden` bị đè. ĐẶT CUỐI KHỐI. ----- */
#trCaiDatQuy [hidden]{display:none !important}
.st-row[hidden], .st-toggle[hidden], .st-list-row[hidden], .st-actions[hidden]{display:none !important}
.st-badge[hidden], .gr-pill[hidden], .gr-confirm[hidden], .gr-menu[hidden], .gr-tools[hidden], .gr-head[hidden]{display:none !important}

/* ============================================================================
   (25/10/2026) GỌN GIAO DIỆN — anh yêu cầu 24/10: mỗi khu vừa MỘT màn hình, khỏi kéo lên kéo xuống. Áp TOÀN TRANG.
   Khối ĐẶT CUỐI FILE ⇒ đè các luật cũ cùng độ mạnh; luật cũ để nguyên (lịch sử trong git).
   ============================================================================ */
/* ① Thanh trên 71 → 54px (khu demo: 54 + dải 24). Mọi chỗ `top` / `100vh -` dùng --t1-h tự lùi theo. */
:root{--t1-h:54px}
html.rental-zone{--t1-h:78px}
@media (min-width:561px){
  .t1-logo{gap:9px}
  .t1-logo img{width:36px; height:36px; border-radius:9px}
  .t1-logo .ten{font-size:21px; padding-bottom:2px}
  .t1-logo .ten small{margin-top:1px; font-size:13px}
}

/* ② Khung bảng + biểu đồ cao theo màn hình thay cho 758px cố định: màn − thanh trên − hàng tab − lề; trần 758, sàn 440 cho nến khỏi bẹp.
   #tang2 (khu trên, không có hàng tab chính) trừ ít hơn #trTaifu / #trThiTruong (có hàng tab "Thành phần · Giao dịch …"). */
#tang2{ --khu-h: clamp(440px, calc(100vh - var(--t1-h) - 34px), 758px); }
:is(#trTaifu,#trThiTruong){ --khu-h: clamp(440px, calc(100vh - var(--t1-h) - 76px), 758px); }
@media (max-width:760px){ :is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac){ --khu-h: 600px; } }

/* ⑥ Tab chính ↔ tab con / khung: 26 → 12px; hàng tab chính sát thanh trên hơn */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-tang{ margin-top:12px; }
.hang-tab{ margin-top:10px; }
.hang-tab.quy-hang-tab{ margin-top:22px; }

/* ③ USDT Markup cùng khuôn biểu đồ coin: bỏ khối số phía trên; P2P/VCB viết tắt ở cụm phải thanh trên (`#mkRates`),
   dòng Trung bình / Cao / Thấp ở thanh dưới (`#stats`, UsdtMarkupChart dời vào). Đệm thanh + dòng O/H/L/C y `.tf-chart-head` / `.tf-ohlc`. */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #chart-card #mkTren{ display:none !important; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #chart-card .bar{ padding:12px 20px 0 10px; row-gap:0; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) #chart-card .bar #ohlc{ padding:8px 12px 0; height:28px !important; line-height:20px !important; gap:14px !important; font-size:13px; box-sizing:border-box; }
/* flex:1 1 0 + min-width:0: lấp chỗ trống giữa cụm trái và dấu ?, thiếu chỗ thì CHỮ tự co (cắt đuôi) thay vì đẩy nút ↻ rớt xuống dòng hai */
#chart-card .mk-rates{ display:flex; align-items:baseline; justify-content:flex-start; gap:4px; flex:1 1 0; min-width:0; overflow:hidden; margin:0 6px 0 10px; font-size:13px; white-space:nowrap; }
#chart-card .mk-rates > *{ flex:none; }
/* ô ghi chú rỗng của công cụ vẽ (.cv-note, flex:1) đang chia đôi chỗ trống với giá ⇒ rỗng thì không chiếm chỗ */
#chart-card .cv-top > .cv-note:empty{ flex:0 0 0; }
/* thẻ hẹp (đo demo màn 1536px: thẻ 736px thiếu 29px) ⇒ giấu phần "▲ +x%" cho giá P2P / VCB đọc trọn */
#chart-card{ container-type:inline-size; }
@container (max-width:780px){ #chart-card .mk-rates .mk-rate-chg{ display:none; } }
#chart-card .mk-rates .mk-rate-lab{ color:var(--dim); font-size:13px; font-weight:500; }
#chart-card .mk-rates .mk-rate-lab ~ .mk-rate-lab{ margin-left:10px; }
#chart-card .mk-rates .mk-rate-val{ font-weight:600; font-size:13px; color:var(--txt); }
#chart-card .mk-rates .mk-rate-chg{ font-size:13px; min-width:0; }
/* thiếu chỗ thì dòng này co (cắt đuôi) — đồng hồ + nút % / log / auto bên phải luôn hiện đủ (đo demo 1536px: để flex:none thì hai thứ đó bị đẩy khuất) */
#chart-card .stats{ display:flex; align-items:center; gap:12px; flex:0 1 auto; min-width:0; overflow:hidden; padding:0 8px; white-space:nowrap; border:0; background:none; }
#chart-card .stats .stat{ display:flex; align-items:baseline; gap:4px; padding:0; border:0; background:none; flex:none; }
#chart-card .stats .stat:nth-child(4){ display:none; }   /* ô "Số phiên" — luật giấu cũ bám #mkTren .stats, nay #stats không còn trong #mkTren */
#chart-card .stats .stat .k{ font-size:12px; letter-spacing:0; text-transform:none; color:var(--dim); white-space:nowrap; }
#chart-card .stats .stat .k::after{ content:":"; }
#chart-card .stats .stat .v{ font-size:12px; font-weight:600; margin:0; white-space:nowrap; }

/* ④ Màu xen kẽ hàng cho MỌI bảng: tô nền <tr> hàng chẵn, độ mạnh 0 (:where) ⇒ hàng có màu riêng (CKV30, đang chọn, tiêu đề nhóm, rê chuột) vẫn thắng. */
:root{ --zebra: color-mix(in srgb, var(--txt) 7%, transparent); }
:where(tbody > tr:nth-child(even)){ background-color:var(--zebra); }
/* cột đầu dính (sticky) của bảng Quản trị có nền --panel riêng ⇒ trộn màu xen kẽ vào nền đó cho vệt sọc liền */
.gr-list tbody > tr:nth-child(even):not(.gr-more) > td:first-child{ background:color-mix(in srgb, var(--txt) 7%, var(--panel)); }

/* ⑤ Biểu tượng đăng xuất: luật cỡ 18px nằm trong <head> index.html cũ, trang React không có ⇒ hình phình hết khung */
.bt-dangxuat svg{ width:18px; height:18px; flex:none; }

/* ⑦ Dòng CKV30 đang chọn: vạch trái CHỈ ở ô đầu (luật cũ kẻ ở từng ô ⇒ mỗi cột một vạch dọc) */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-bang tr.tf-ckv.chon td{ box-shadow:none; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-bang tr.tf-ckv.chon td:first-child{ box-shadow:inset 2px 0 0 var(--txt); }

/* ⑧ Hàng bảng sát lại (đệm trên/dưới mỗi ô) — mọi bảng; chữ giữ nguyên cỡ */
tbody td{ padding-top:8px; padding-bottom:8px; }
.con tbody td{ padding-top:6px; padding-bottom:6px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-bang tbody td{ padding-top:6px; padding-bottom:6px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-khu .tf-bang tbody td{ padding-top:5px; padding-bottom:5px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .ls-bang tbody td{ padding-top:4px; padding-bottom:4px; }
.ns-wrap .ns-bang td{ padding-top:5px; padding-bottom:5px; }
.qt-bang td{ padding-top:6px; padding-bottom:6px; }
.quy-bang tbody td{ padding-top:5px; padding-bottom:5px; }
#trQuy .quy-bang tbody td{ padding-top:5px; padding-bottom:5px; }
#trQuy .quy-khu-trai .quy-bang tbody td{ padding-top:4px; padding-bottom:4px; }
#trQuy .quy-bang tr.quy-nhom td, #trQuy .quy-khu-trai .quy-bang tr.quy-nhom td{ padding-top:4px; padding-bottom:4px; }
#trQuy .quy-member-avatar{ width:26px; height:26px; }
#trQuy #quyNdtBang .quy-member-avatar{ width:auto; height:26px; min-width:26px; border-radius:13px; }
.gr-table td{ padding-top:5px; padding-bottom:5px; }

/* ════════════════════════════════════════════════════════════════════
   (25/10/2026) GỌN GIAO DIỆN VÒNG 2 — anh yêu cầu 24/10: một hàng bảng chỉ một dòng, ⛶ bung kín màn, bỏ phần đầu tab.
   ════════════════════════════════════════════════════════════════════ */
/* ① Một hàng bảng = một dòng chữ: chữ không tự ngắt. Chừa bảng chữ dài (bài Thư viện, hộp Ghi chú) ⇒ vẫn ngắt như cũ. */
:where(tbody td, thead th){ white-space:nowrap; }
:where(.tv-prose, #ghiChuNoiDung) :where(td, th){ white-space:normal; }
/* ô chữ gõ tay ở các bảng Quỹ (ghi chú lệnh góp / rút, sổ tiền mặt, tiết kiệm, chi, nhật ký, ô trạng thái + nút huỷ) và cột "Lý do" Top 100:
   ghi chú dài tới 500 chữ ⇒ để một dòng thì bảng rộng hàng nghìn px, nút Huỷ trôi khỏi màn ⇒ vẫn ngắt như cũ. Ô số / tên đều có lớp nên không dính. */
.quy-bang :where(td:not([class]), td.quy-audit-note, td.quy-khong-gach), .tf-ly{ white-space:normal; }
/* dòng phụ (tên đầy đủ, "danh mục đầu tư", % cạnh số tiền) đứng CẠNH dòng chính thay vì xuống dưới */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) :is(.tf-ten, .tf-sym, .ls-sym, .qlc-sym) small,
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .qlc-bang td.r small,
.symbol small,
.quy-ten small, .quy-bang td.p small{ display:inline; margin-left:6px; }
/* (02/11/2026, anh dặn) bảng Quỹ: riêng ô "Nắm giữ" của hai hàng Giá 1 ĐVQ + NAV để chữ phụ ("đang lưu hành", "tiền mặt …")
   xuống dòng 2 ⇒ cột Nắm giữ hẹp lại; các hàng thành viên giữ một dòng như cũ. */
#quyBang tr:is([data-quy-dong="gia"], [data-quy-dong="nav"]) > td:last-child small{ display:block; margin-left:0; }
/* bảng Chỉ số / Thành phần coin nhiều cột: đệm ngang 9 → 7px cho vừa khung hơn khi chữ không ngắt nữa */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-bang :is(td, th){ padding-left:7px; padding-right:7px; }

/* ② ⛶ bảng "Chỉ số & Danh mục", "Thành phần coin", "Chỉ số & Thành viên" bung KÍN màn hình — y biểu đồ nến `.cv-on.tf-full` */
#trTaifu .th-3.tf-full, #trQuy .quy-khu-trai.quy-full, :is(#trTaifu,#tang2) .th-1.tf-full{ inset:0; border-radius:0; box-shadow:none; height:auto; }

/* ②b Mới mở trang, khung biểu đồ nến vẽ trước theo khuôn cũ (cách bảng 22px, bo góc) rồi máy công cụ vẽ nạp xong mới đổi sang khuôn
   mới (cách 8px, góc vuông) ⇒ anh thấy hai khung nhảy lại gần nhau. Đặt sẵn khuôn mới từ đầu cho khỏi nhảy. */
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .th-tang{ gap:8px; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-chart-card, #chart-card{ border-radius:0; }

/* ③ Bỏ phần đầu tab (chữ giới thiệu + bánh "Tỷ lệ danh mục") — tab Giao dịch, Chẩn đoán, Dữ liệu thị trường. `!important` vì
   React gắn `style="display:block"` thẳng lên khối đầu tab Dữ liệu thị trường. */
#trGiaodich .hero-gd, #trChanDoan .hero, #trThiTruong .hero{ display:none !important; }

/* ============================================================================================================
   (25/10/2026) GỌN GIAO DIỆN VÒNG 3 — anh yêu cầu 24/10 («b6b6ef07»). Từ G8 tệp này là nguồn phát thật (style.css đóng băng).
   · Cỡ chữ nhỏ/vừa toàn tệp đã nâng tại chỗ: 10–12,5px +1 · 13–13,5px +0,5 · <10px và ≥14px giữ. Chữ mờ đậm hơn (--dim/--dim2).
   · Đầu cột: chữ chính in đậm; dòng phụ "(01/10/2026)", "(hôm nay)", "(USD)"… luôn nằm dòng riêng, chữ thường, không đậm.
     (trừ mũi tên xếp ▲▼ của sổ dòng tiền Quỹ — th[data-sap]). Chữ chính `!important` vì vài bảng đặt độ đậm bằng luật mang id
     (#trQuy, #trThuVien). Luật dòng phụ bọc :where (độ ưu tiên thấp) để nhãn đơn vị riêng của bảng con / bảng nhập (.con, .hn-bang
     thead small 9,5px đậm) vẫn thắng; cột đang xếp thì dòng phụ đổi màu theo chữ chính.
   · Bảng #1 "Chỉ số & danh mục": một kiểu xen kẽ cho mọi hàng — bỏ nền + chữ tím của 2 hàng CKV30 và nền tím hàng đang
     chọn; hàng đang chọn chỉ còn vạch đậm bên trái.
   ============================================================================================================ */
thead th{ font-weight:700 !important; }
:where(thead th:not([data-sap])) small{ display:block; font-size:11px; font-weight:400; text-transform:none; letter-spacing:.02em; color:var(--dim2); }
th.xep.dang small, th.xepcon.dang small{ color:inherit; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) tr.tf-chiso.chon{ background:none; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) tbody > tr.tf-chiso.chon:nth-child(even){ background-color:var(--zebra); }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-bang tr.tf-ckv td,
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-bang tr.tf-ckv.chon td{ background:none; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-bang tr.tf-ckv .tf-ten b{ color:inherit; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) tr.tf-dm td.tf-ten small{ color:var(--dim2); }

/* ===== (25/10/2026) GỌN GIAO DIỆN VÒNG 4 — A: bảng Quỹ "Chỉ số & Thành viên" + ô sửa thành viên ===== */
/* ① Mọi hàng bảng #quyBang cao bằng nhau: vòng tròn viết tắt 32px đẩy hàng thành viên lên ~41px ⇒ thu về viên dẹt cao 18px
     (vừa một dòng chữ, hàng còn ~28px như hàng Giá 1 ĐVQ / NAV). Mã dài (tới 8 ký tự) thì viên tự giãn ngang, không tràn. Cỡ chữ hàng giữ nguyên. */
#trQuy #quyBang .quy-nguoi .quy-tron{width:auto; min-width:18px; height:18px; padding:0 4px; box-sizing:border-box; border-radius:9px;
  font-size:10.5px; line-height:18px}
#trQuy #quyBang .quy-nguoi .quy-ma{height:18px; min-width:0; font-size:11.5px; line-height:18px}
/* ①b (25/10/2026, anh) giãn cách dòng #quyBang = bảng "Chỉ số & Danh mục" #tfBang1 trang Chỉ số. Đo Chrome trên CSS này (cửa sổ 1800px):
     #tfBang1 hàng 32,4px = đệm 5px trên/dưới (`.th-khu .tf-bang tbody td`, khối gọn vòng 2) + dòng 21,45px (cỡ 13px × line-height 1,65
     của body) + kẻ 1px; #quyBang trước đây 27,9px = đệm 4px + dòng 18,9px (13,5px × 1,4 của #trQuy) + kẻ 1px.
     ⇒ cùng đệm 5px + cùng chiều cao dòng 21,45px (ghi px để cỡ chữ 13,5px của bảng Quỹ — giữ nguyên — không kéo dòng cao hơn).
     Hàng Giá 1 ĐVQ / NAV (ô hai phần có <small> nằm cùng dòng) và hàng thành viên (viên mã 18px) cao bằng nhau. */
#trQuy .quy-khu-trai #quyBang tbody td{padding-top:5px; padding-bottom:5px; line-height:21.45px}
/* ② Ô sửa thành viên: ô "Tài khoản đăng nhập" (select) rộng + cao như ô chữ; ba ô dài (Tên · Tài khoản · Số ĐT) cùng một bề ngang. */
#trQuy .quy-sua select{font:inherit; font-size:14px; padding:9px 12px; border:1px solid var(--line); border-radius:8px; background:var(--panel); color:var(--txt)}
#trQuy .quy-sua select:focus{outline:none; border-color:var(--cool); box-shadow:0 0 0 3px var(--cool-soft)}
#trQuy .quy-sua #quySuaTen, #trQuy .quy-sua #quySuaTk, #trQuy .quy-sua #quySuaPhone{width:240px; max-width:100%; box-sizing:border-box}
/* ③ Nút "Huỷ" rõ: viền đậm hơn, chữ màu chữ chính, đậm; cao bằng nút Lưu bên cạnh. */
#trQuy .quy-sua #quySuaThoi{font-size:14px; font-weight:600; padding:9px 16px; color:var(--txt); background:transparent;
  border:1px solid color-mix(in srgb, var(--txt) 55%, var(--line)); opacity:1}
#trQuy .quy-sua #quySuaThoi:hover{background:var(--line-soft)}
/* ===== HẾT VÒNG 4 — A ===== */

/* ===== (25/10/2026) GỌN GIAO DIỆN VÒNG 4 — B: mọi bảng (thùng rác / bút, đầu cột xuống dòng, bỏ ?, xen kẽ nhạt + đường kẻ, nút Thôi rõ) ===== */
/* Màn điện thoại /m không có bảng (<table>) ⇒ các luật dưới không đụng bố cục /m. */
/* ① Nút 🗑 trong bảng: to gấp đôi, màu ĐỎ. Hình emoji không nhuộm màu được ⇒ giấu chữ (cỡ 0), vẽ hình thùng rác bộ Tabler
     (outline/trash.svg) bằng mặt nạ + nền đỏ --down. Chỉ nút CHỈ CÓ hình 🗑 (nút "🗑 Xoá bộ", "🗑 Huỷ lệnh"… có chữ thì để nguyên).
     Bắt theo thuộc tính sẵn có (không đổi HTML): Giao dịch [data-xoa] · dòng nháp [data-choxoa] / [data-suaxoa] (🗑 dòng đang sửa, 31/10/2026) · Ngân sách .ns-nut-xoahm / .ns-h-xoa ·
     Quản lý coin .qlc-go · Quỹ .nut-link (bỏ dòng nháp / huỷ lần rút / huỷ lệnh, điều chỉnh). `!important` vì luật cũ mang id (#trTaifu…). */
:root{ --icon-trash:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7l16 0'/%3E%3Cpath d='M10 11l0 6'/%3E%3Cpath d='M14 11l0 6'/%3E%3Cpath d='M5 7l1 12a2 2 0 0 0 2 2h8a2 2 0 0 0 2 -2l1 -12'/%3E%3Cpath d='M9 7v-3a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v3'/%3E%3C/svg%3E"); }
:is(button[data-xoa], button[data-choxoa], button[data-suaxoa], .ns-nut-xoahm, .ns-h-xoa, .qlc-go,
    .nut-link:is([data-gd-bo], [data-tk-bo], [data-tkr-huy], [data-cp-bo], [data-huy-id])){
  font-size:0 !important; line-height:0 !important; color:transparent !important; text-decoration:none !important;
  width:auto !important; height:auto !important; padding:2px !important; margin-block:-3px; vertical-align:middle; }
:is(button[data-xoa], button[data-choxoa], button[data-suaxoa], .ns-nut-xoahm, .ns-h-xoa, .qlc-go,
    .nut-link:is([data-gd-bo], [data-tk-bo], [data-tkr-huy], [data-cp-bo], [data-huy-id]))::before{
  content:""; display:inline-block; width:18px; height:18px; vertical-align:middle; background-color:var(--down);
  -webkit-mask:var(--icon-trash) center / contain no-repeat; mask:var(--icon-trash) center / contain no-repeat; }
/* dòng nháp Giao dịch: nút trần (khung xám mặc định của trình duyệt) ⇒ bỏ khung cho giống các nút hình khác */
button:is([data-choxoa], [data-suaxoa]){ background:none; border:0; cursor:pointer; }
button:is([data-choxoa], [data-suaxoa]):disabled{ opacity:.45; cursor:default; }
:is(button[data-xoa], button[data-choxoa], button[data-suaxoa], .ns-nut-xoahm, .ns-h-xoa, .qlc-go, .nut-link[data-gd-bo], .nut-link[data-tk-bo],
    .nut-link[data-tkr-huy], .nut-link[data-cp-bo], .nut-link[data-huy-id]):hover:not(:disabled)::before{ opacity:.75; }

/* ② Nút ✎ sửa: to gấp đôi, màu ĐEN (= màu chữ chính --txt, nền tối tự sáng). Ký tự ✎ nhuộm được bằng color. Lề âm trên/dưới
     ⇒ hàng không cao thêm. Giao dịch [data-sua] · Quỹ ghi chú lệnh góp .quy-note-edit · sổ tiết kiệm [data-tk-sua] ·
     Ngân sách mục tiêu / khoản / khoản cân đối / số người phụ thuộc (bảng cân đối). */
:is(button[data-sua], button[data-tk-sua], .quy-note-edit,
    button:is([data-nsviec="suaMt"], [data-nsviec="suaKhoan"], [data-nsviec="suaKhoanCD"]), .ns-cd-phu .ns-nut-o[data-nsviec="suaBo"]){
  font-size:17px !important; line-height:1 !important; color:var(--txt) !important; text-decoration:none !important;
  width:auto !important; height:auto !important; padding:0 3px !important; margin-block:-3px; vertical-align:middle; }
:is(button[data-sua], button[data-tk-sua], .quy-note-edit,
    button:is([data-nsviec="suaMt"], [data-nsviec="suaKhoan"], [data-nsviec="suaKhoanCD"]), .ns-cd-phu .ns-nut-o[data-nsviec="suaBo"]):hover:not(:disabled){ opacity:.7; }

/* ③ Đầu cột: chữ được xuống dòng ⇒ cột hẹp lại theo số trong cột (ô số giữ một dòng như vòng 2). Bảng còn rộng thì đầu cột vẫn
     một dòng; bảng chật thì máy chia bề ngang, đầu cột tự ngắt theo bề rộng cột số (cột rộng ⇒ nhiều chữ một dòng, không mỗi chữ
     một dòng). Đè: luật gốc `thead th` + th.xep / th.xepcon (Giao dịch) + th.tf-sx (Top 100) đang ép một dòng.
     Dòng phụ <small> (vòng 3, display:block) vẫn nằm dòng riêng. */
thead th, thead th:is(.xep, .xepcon){ white-space:normal; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-bang thead th.tf-sx{ white-space:normal; }

/* ④ Bỏ dấu ? ở MỌI hàng đầu cột (Quỹ .quy-hoi do helpButton vẽ · Tái cân bằng .tcb-hoi · các nút hỏi khác nếu có).
     Nút ? trong Ô HÀNG (tbody, vd "Giá 1 ĐVQ ?", dòng TỔNG, dải giỏ) giữ nguyên — luật chỉ bắt trong thead th. */
thead th :is(.quy-hoi, .tcb-hoi, .cd-hoi, .ns-hoi, .qt-hoi, .o-hoi, .nhan-hoi, .tf-cd-hoi, .tf-gio-hoi, .tf-tong-hoi,
             [data-quyhoi], [data-tcbhoi], [data-cdhoi], [data-tfhoi], [data-nshoi]){ display:none !important; }

/* ⑤ Màu xen kẽ nhạt bớt 7 → 4 % (sáng lẫn tối — trộn theo --txt nên tự đổi) + đường kẻ ngang giữa các hàng cho MỌI bảng, cùng màu
     bảng Quỹ "Chỉ số & Thành viên" (`#trQuy .quy-bang tbody td`: 1px, --line pha 12 % --dim). Chỉ đổi MÀU đường kẻ (border-bottom-color)
     ⇒ chỗ cố ý bỏ kẻ (hàng cuối, hàng tiêu đề nhóm Ngân sách: border 0) vẫn không kẻ. Chừa: dòng nháp chờ gửi (.hang-cho — viền
     vàng gạch, dòng lỗi viền đỏ) và bảng bài Thư viện (màu kẻ riêng --tv-rule). */
:root{ --zebra: color-mix(in srgb, var(--txt) 4%, transparent);
  --row-line: color-mix(in srgb, var(--line) 88%, var(--dim)); }
.gr-list tbody > tr:nth-child(even):not(.gr-more) > td:first-child{ background:color-mix(in srgb, var(--txt) 4%, var(--panel)); }
tbody > tr:not(.hang-cho) > td{ border-bottom-color:var(--row-line) !important; }
#trThuVien :is(.tv-prose, .tv-results) tbody > tr > td, #trThuVien .tv-results tr > td{ border-bottom-color:var(--tv-rule) !important; }

/* ⑥ Nút "Thôi" ở các hộp xác nhận đang mờ ⇒ rõ: viền đậm (cùng màu nút "Huỷ" ô sửa thành viên, khối A), chữ màu chữ chính, đậm.
     Hộp chung Quỹ #quyXacNhanHuy · ô hỏi lại mật khẩu / 2FA Quản trị (.gr-confirm, nút type=button) · Tài khoản #tkHuyBatMa. Chữ "Thôi" giữ nguyên. */
#quyXacNhanHuy, .gr-confirm > .gr-btn[type="button"], #tkHuyBatMa{
  color:var(--txt) !important; font-weight:600; background:var(--panel) !important; opacity:1;
  border:1px solid color-mix(in srgb, var(--txt) 55%, var(--line)) !important; }
#quyXacNhanHuy:hover, .gr-confirm > .gr-btn[type="button"]:hover, #tkHuyBatMa:hover{ background:var(--line-soft) !important; }
/* ===== HẾT VÒNG 4 — B ===== */

/* ===== (25/10/2026) GỌN GIAO DIỆN VÒNG 4 — C: mũi tên xếp mảnh + ghi chú 2 dòng ===== */
/* Bộ xếp chung + ghi chú 2 dòng: src/shared/tableSort.ts (gắn ở Shell). Biểu tượng Tabler 3.49: selector · chevron-up · chevron-down.
   ① Đầu cột xếp được mang data-ts; cột đang xếp mang data-ts-dir="asc|desc" (mũi tên một chiều + đổi màu như th.xep.dang).
      Đầu cột xuống dòng (khối B) mà mũi tên là hộp inline-block / float thì trình duyệt được ngắt dòng trước nó ⇒ mũi tên rớt xuống
      một dòng riêng (đo Chrome: đầu cột "Giá" trên cột "12,34" cao 46 → 66px). Nên mũi tên ::after là hộp `inline` RỖNG vẽ bằng
      padding: hộp inline rỗng không tạo chỗ ngắt dòng ⇒ dính vào chữ cuối của tên cột (đo lại: 46px, cột rộng thêm ~4px).
      Đầu cột có dòng phụ <small> (vòng 3, display:block): ::after của th sẽ thành một dòng mới sau khối small ⇒ vẽ mũi tên ở
      small::after (dính chữ cuối dòng phụ) và tắt ::after của th.
      Màu cột đang xếp `!important` vì luật cũ mang id (#trQuy .quy-bang thead th, #trThuVien .tv-prose th) mạnh hơn.
   ② Bảng có cơ chế xếp riêng (th.xep · th.xepcon · th[data-sap]) giữ logic cũ; chữ ▲▼⇅ của chúng được gắn data-sort-arrow ⇒ vẽ lại nét mảnh.
      Thẻ mũi tên đứng SÁT chữ tên cột (không khoảng trắng) ⇒ cho nó là hộp `inline` (vẽ bằng padding) để dính vào chữ cuối, không
      được ngắt dòng trước nó (inline-block thì trình duyệt được ngắt). Top 100 (.tf-sx-mo, có khoảng trắng đứng trước nên vẫn ngắt
      được) ⇒ cho hộp rộng 0, chữ ▲▼ tràn sang lề phải của ô: hộp rộng 0 luôn vừa dòng ⇒ không đẻ dòng riêng.
   ③ Ô Ghi chú: div.ts-note (bộ xếp bọc) / .ns-ghichu (Ngân sách) tối đa 2 dòng; bấm mở hết (.ts-open), bấm lần nữa thu.
      Nút trong ô (✎ · 🗑) đứng ngoài hộp ⇒ hộp thành inline để nút đứng ngay cạnh. */
:root{ --icon-sort:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 9l4 -4l4 4'/%3E%3Cpath d='M16 15l-4 4l-4 -4'/%3E%3C/svg%3E");
  --icon-sort-up:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 15l6 -6l6 6'/%3E%3C/svg%3E");
  --icon-sort-down:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6l6 -6'/%3E%3C/svg%3E"); }
th[data-ts]{ cursor:pointer; user-select:none; }
:is(#trQuy, #trThuVien, html) th[data-ts]:hover{ color:var(--txt); }
th[data-ts]::after, th[data-ts] > small:last-of-type::after{ content:''; display:inline; padding-left:11px; margin-left:4px; font-size:12px;
  background:currentColor; opacity:.4; -webkit-mask:var(--icon-sort) center / 11px 11px no-repeat; mask:var(--icon-sort) center / 11px 11px no-repeat; }
th[data-ts]:has(> small)::after{ content:none; }
th[data-ts]:hover::after, th[data-ts]:hover > small:last-of-type::after{ opacity:.75; }
th[data-ts][data-ts-dir]{ color:var(--cool) !important; }
th[data-ts][data-ts-dir] small{ color:inherit !important; }
th[data-ts][data-ts-dir]::after, th[data-ts][data-ts-dir] > small:last-of-type::after{ opacity:1; }
th[data-ts][data-ts-dir="asc"]::after, th[data-ts][data-ts-dir="asc"] > small:last-of-type::after{ -webkit-mask-image:var(--icon-sort-up); mask-image:var(--icon-sort-up); }
th[data-ts][data-ts-dir="desc"]::after, th[data-ts][data-ts-dir="desc"] > small:last-of-type::after{ -webkit-mask-image:var(--icon-sort-down); mask-image:var(--icon-sort-down); }
[data-sort-arrow]{ font-size:0 !important; display:inline !important; width:auto !important; height:auto !important; padding:5.5px 0 5.5px 11px !important;
  margin-left:4px; vertical-align:middle; color:inherit !important;
  background:currentColor; opacity:.4; -webkit-mask:var(--icon-sort) center / contain no-repeat; mask:var(--icon-sort) center / contain no-repeat; }
th:hover > [data-sort-arrow], th:hover > .th-dong > [data-sort-arrow]{ opacity:.75; }
:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac) .tf-bang thead th.tf-sx .tf-sx-mo{ display:inline-block; width:0; white-space:nowrap; overflow:visible; }
[data-sort-arrow="up"], [data-sort-arrow="down"]{ opacity:1; }
[data-sort-arrow="up"]{ -webkit-mask-image:var(--icon-sort-up); mask-image:var(--icon-sort-up); }
[data-sort-arrow="down"]{ -webkit-mask-image:var(--icon-sort-down); mask-image:var(--icon-sort-down); }
.ts-note, .ns-wrap .ns-ghichu{ display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; line-clamp:2; overflow:hidden; overflow-wrap:anywhere; word-break:break-word; cursor:pointer; }
.ts-note{ white-space:normal; width:max-content; max-width:22em; }
.ghichu-o > .ts-note{ width:auto; max-width:none; }
.ts-note.ts-open, .ns-wrap .ns-ghichu.ts-open{ display:block; -webkit-line-clamp:unset; line-clamp:none; overflow:visible; }
.ts-note:not(:only-child){ display:-webkit-inline-box; vertical-align:middle; }
.ts-note.ts-open:not(:only-child){ display:inline-block; }
/* Lý do huỷ dưới nhãn "Đã huỷ" (bảng lệnh Quỹ) cũng là ghi chú: tối đa 2 dòng, cột nới ra cho đọc được; câu đủ ở title của nhãn "Đã huỷ". */
#trQuy td .quy-void-reason{display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; white-space:normal; min-width:14em}
/* (25/10/2026, anh xem trang thật) thùng rác 26 → 18px, bút ✎ 26 → 17px — cỡ như ảnh mẫu anh gửi (sửa ngay trong khối B ở trên). */
/* Đầu cột căn GIỮA cho chữ chính + dòng phụ cân nhau: cột số (.p) và mọi đầu cột có dòng phụ <small>. Cột chữ không dòng phụ giữ căn trái. */
thead th.p, thead th:has(> small){ text-align:center !important; }
/* Ô mã viết tắt thành viên (vòng tròn / nhãn mã) cùng một kiểu nền xanh lam nhạt + chữ xanh lam như nhãn mã .quy-ma — mọi chỗ:
   bảng "Chỉ số & Thành viên", bảng Thành viên, dòng tổng bảng lệnh, đầu hộp lịch sử một người, thẻ khớp tên. `!important` để đè màu
   riêng từng người ghi thẳng trong thẻ (style="…" ở fundTable / memberDetailHtml). Chừa vòng "₫" Dòng tiền (.quy-dt-tron, màu vàng —
   không phải mã người). Điện thoại /m: src/mobile/screens/fund/fund.css (.m-fund-name em). */
.quy-tron:not(.quy-dt-tron), .quy-member-avatar{ background:var(--cool-soft) !important; color:var(--cool) !important; }
/* ===== HẾT VÒNG 4 — C ===== */

/* ===== (25/10/2026) GỌN GIAO DIỆN VÒNG 4 — D: tab Chẩn đoán (khu "Chỉ số hiệu suất chính" + 3 bánh Lãi / Lỗ) ===== */
/* Canvas: CSS quyết kích thước, JS đọc lại (getBoundingClientRect × devicePixelRatio). Chữ vẽ trên canvas đổi cỡ trong
   src/chandoan/stackedColumn.ts · gauge.ts · pies.ts (cùng ngày). Bố cục 3 thẻ mỗi hàng giữ nguyên. */
/* ① Thẻ cao hơn chút cho hình to ra. */
#trChanDoan .cd-hang3 .cd-the{min-height:236px}
/* ② Cột chồng "Lãi/lỗ (USD)": 118×168 ⇒ 180×220 (cột rộng tối đa 80px, chữ trong cột + trục to hơn — xem stackedColumn.ts). */
#trChanDoan .cd-cv-cot{width:180px; height:220px}
/* ③ Bánh vòng phân bổ vốn: cỡ gốc 240 ⇒ 300px, trần 330 ⇒ 360px; chú giải giữ cỡ gốc 118px (108 thì "USDT: 15,55 %" bị cắt — đo Chrome).
     Cửa sổ 1536px: chỗ trong thẻ ~443px = 300 + 10 + 118 + phần dư ⇒ bánh ~312px (trước 300), chú giải vẫn đứng bên phải. Chỗ trong
     thẻ < 428px (cửa sổ dưới ~1490px) thì chú giải rớt xuống dưới hình như luật #111 cũ — bánh không co dưới 300px. */
#trChanDoan .cd-donut-hop .donut-ve{flex:4 1 300px; max-width:360px; min-width:min(300px,100%)}
/* ④ Đồng hồ kim: 190×122 ⇒ 250×160; chữ nhãn ("Quá nhiều coin", "Vừa phải"…) xuống DƯỚI CHÂN đồng hồ, canh giữa (trước đứng bên phải). */
#trChanDoan .cd-the-trong:has(> #cdGauge){flex-direction:column; justify-content:center; align-items:center; gap:6px}
#trChanDoan .cd-cv-gauge{width:250px; height:160px; max-width:100%}
#trChanDoan .cd-gauge-nhan{flex:none; text-align:center}
/* ⑤ Ba bánh "dây kéo" (Lãi / Lỗ · Lời / Lỗ trung bình mỗi lệnh · Tỷ lệ thắng): khung 5 ngang × 3 cao (trước cao cứng 150px) — bánh
     chiếm gần hết chiều cao khung, chữ nhãn 13px / số đậm 15px gần cỡ trang thầy (14 / 15–16; 14px thì nhãn dài bị cắt ở cửa sổ 1536px) — pies.ts. */
#trChanDoan .cd-cv-pie{height:auto; aspect-ratio:5 / 3}
/* ===== HẾT VÒNG 4 — D ===== */

/* ===== KHO NHỚ CHUYỂN TRANG — chữ báo tải lại ngầm (shared/RefreshBadge.tsx) =====
   Cố định góc dưới phải ⇒ không đẩy bố cục; trên nội dung + menu (900), dưới hộp thoại / cổng đăng nhập (1000); không chặn bấm. */
.page-refresh-badge{position:fixed; right:8px; bottom:8px; z-index:950; pointer-events:none;
  padding:2px 8px; font-size:11px; line-height:16px; white-space:nowrap; max-width:calc(100vw - 16px); overflow:hidden; text-overflow:ellipsis;
  color:var(--dim); background:var(--panel); border:1px solid var(--line); opacity:.92}
.page-refresh-badge-failed{color:var(--down); border-color:var(--down)}
/* điện thoại /m: nổi TRÊN thanh tab dưới (cao 52px + vùng an toàn, z 40) và DƯỚI bảng trượt (z 50) */
.m-app .page-refresh-badge{bottom:calc(60px + env(safe-area-inset-bottom, 0px)); z-index:45}
/* ===== HẾT KHO NHỚ CHUYỂN TRANG ===== */

/* ===== (26/10/2026) MẶT «NGUỒN DỮ LIỆU» — tab Dữ liệu thị trường, chỉ chủ trang (src/chiso/dataSources) =====
   Chép khối CSS của mockup đã duyệt (Mockups/mockup-nguon-du-lieu-v1.html): lớp mới nd-*, bó dưới #trThiTruong như các mặt khác.
   Góc vuông (thẻ, khung, bảng), chữ bảng nhỏ 12px, lưới co giãn hết bề ngang; dưới 1100px các lưới hai cột xếp một cột. */
#trThiTruong .nd-dau{display:flex; flex-wrap:wrap; align-items:center; gap:8px 16px; margin:12px 0 2px; font-size:12.5px; color:var(--dim)}
#trThiTruong .nd-khoa{display:inline-flex; align-items:center; gap:6px; padding:3px 10px; border-radius:999px; background:var(--cool-soft); color:var(--cool); font-weight:600}
#trThiTruong .nd-mucluc{display:flex; flex-wrap:wrap; gap:4px 14px; margin-left:auto}
#trThiTruong .nd-mucluc a{color:var(--dim); text-decoration:none; border-bottom:1px dashed var(--line)}
#trThiTruong .nd-mucluc a:hover{color:var(--cool); border-color:var(--cool)}
#trThiTruong .nd-nut{display:inline-flex; align-items:center; gap:5px; font:inherit; font-size:12.5px; padding:3px 10px; border:1px solid var(--line); border-radius:999px; background:var(--panel); color:var(--dim); cursor:pointer}
#trThiTruong .nd-nut:hover{color:var(--txt); border-color:var(--cool)}
#trThiTruong .nd-ic{width:16px; height:16px; flex:none; vertical-align:-3px}
#trThiTruong .nd-muc{margin:20px 0 0; padding:0; scroll-margin-top:12px}
#trThiTruong .nd-cat-o{display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
#trThiTruong .nd-muc > h3{display:flex; align-items:center; gap:8px; margin:0 0 10px; font-size:15px; font-weight:700; color:var(--txt)}
#trThiTruong .nd-so-muc{display:inline-flex; width:20px; height:20px; align-items:center; justify-content:center; background:var(--txt); color:var(--panel); font-size:12px; font-weight:700}
#trThiTruong .nd-phu{font-size:12px; font-weight:400; color:var(--dim2)}
/* nút "?" tròn nhỏ — y khuôn .quy-hoi của trang Quỹ (#98) */
#trThiTruong .nd-hoi{display:inline-flex; align-items:center; justify-content:center; flex:none; width:15px; height:15px; margin:0 0 0 5px; padding:0;
  border:1px solid var(--line); border-radius:50%; background:transparent; color:var(--dim); font:600 10px/1 var(--font); vertical-align:middle; cursor:pointer}
#trThiTruong .nd-hoi::before{content:"?"}
#trThiTruong .nd-hoi:hover, #trThiTruong .nd-hoi:focus-visible{color:var(--txt); border-color:var(--txt); outline:none}
/* đèn */
#trThiTruong .nd-den{display:inline-block; width:9px; height:9px; border-radius:50%; flex:none; vertical-align:middle}
#trThiTruong .nd-den-xanh, #ghiChuNoiDung .nd-den-xanh{background:var(--up)} #trThiTruong .nd-den-vang, #ghiChuNoiDung .nd-den-vang{background:var(--gold)}
#trThiTruong .nd-den-do, #ghiChuNoiDung .nd-den-do{background:var(--down)} #trThiTruong .nd-den-xam, #ghiChuNoiDung .nd-den-xam{background:#94A3B8}
#trThiTruong .nd-chu-xanh{color:var(--up)} #trThiTruong .nd-chu-vang{color:var(--gold)} #trThiTruong .nd-chu-do{color:var(--down)} #trThiTruong .nd-chu-xam{color:var(--dim2)}
/* ① thẻ đèn tổng — góc vuông, thanh dọc màu đèn bên trái */
#trThiTruong .nd-the-luoi{display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:10px}
#trThiTruong .nd-the{position:relative; display:block; width:100%; text-align:left; font:inherit; color:inherit; background:var(--panel); border:1px solid var(--line); border-radius:0; padding:10px 12px 10px 15px; cursor:pointer}
#trThiTruong .nd-the::before{content:""; position:absolute; left:0; top:0; bottom:0; width:3px; background:var(--nd-mau,#94A3B8)}
#trThiTruong .nd-the:hover{border-color:var(--cool)}
#trThiTruong .nd-the-dau{display:flex; align-items:center; gap:7px; font-size:12.5px; font-weight:600; color:var(--dim)}
#trThiTruong .nd-the-dau .nd-den{margin-left:auto}
#trThiTruong .nd-the-so{margin:6px 0 3px; font-size:20px; font-weight:700; color:var(--txt); font-variant-numeric:tabular-nums}
#trThiTruong .nd-the-so small{font-size:12px; font-weight:600; color:var(--dim)}
#trThiTruong .nd-the-dong{font-size:12px; line-height:1.6; color:var(--dim); font-variant-numeric:tabular-nums}
#trThiTruong .nd-the-vi{margin-top:5px; padding-top:5px; border-top:1px solid var(--line-soft); font-size:12px; font-weight:600}
#trThiTruong .nd-chu-thich{display:flex; flex-wrap:wrap; align-items:center; gap:6px 14px; margin-top:8px; font-size:12px; color:var(--dim)}
#trThiTruong .nd-chu-thich span{display:inline-flex; align-items:center; gap:5px}
/* bảng — kế thừa .ls-bang, cỡ chữ nhỏ của tab Chỉ số, góc vuông */
#trThiTruong .nd-bang{border-radius:0; overflow:auto}
#trThiTruong .nd-bang table{font-size:12px}
#trThiTruong .nd-bang thead th{font-size:11px; white-space:nowrap}
#trThiTruong .nd-bang tbody td{padding:5px 8px}
#trThiTruong .nd-bang tr.nd-sang td{background:var(--cool-soft)}
#trThiTruong .nd-bang tr.nd-bo td{color:var(--dim2)}
#trThiTruong .nd-bang th.sx{cursor:pointer; user-select:none} #trThiTruong .nd-bang th.sx:hover{color:var(--cool)}
#trThiTruong .nd-ma{font-family:var(--mono); font-size:11px; color:var(--dim2)}
#trThiTruong .nd-nhat{color:var(--dim2)}
#trThiTruong .nd-cat{max-width:420px; overflow:hidden; text-overflow:ellipsis}
#trThiTruong .nd-cat-hep{max-width:220px; overflow:hidden; text-overflow:ellipsis}
#trThiTruong .nd-cong-cu{display:flex; flex-wrap:wrap; align-items:center; gap:8px 14px; margin:0 0 8px; font-size:12.5px; color:var(--dim)}
#trThiTruong .nd-cong-cu label{display:inline-flex; align-items:center; gap:5px; cursor:pointer}
#trThiTruong .nd-cong-cu .ls-sel{font-size:12.5px; padding:4px 8px}
#trThiTruong .nd-dem{margin-left:auto; color:var(--dim2)}
#trThiTruong .nd-nhan{display:inline-block; margin-left:5px; padding:0 5px; border-radius:999px; font-size:10px; font-weight:600; line-height:16px; vertical-align:1px; background:var(--line-soft); color:var(--dim)}
#trThiTruong .nd-nhan-ro{background:var(--cool-soft); color:var(--cool)}
#trThiTruong .nd-nhan-top{background:#ECFDF5; color:var(--up)}
#trThiTruong .nd-nhan-mong{background:#FFF7E6; color:var(--gold)}
#trThiTruong .nd-kl{white-space:nowrap; font-weight:600}
#trThiTruong .nd-kl-giu{color:var(--up)} #trThiTruong .nd-kl-bo{color:var(--dim2); font-weight:400}
/* ③ tỷ giá */
#trThiTruong .nd-tg{display:grid; grid-template-columns:minmax(0,1.7fr) minmax(420px,1fr); gap:12px; align-items:start}
/* cột phải không được đẩy trang tràn ngang (đo trang thật 27/10: bảng lệch 7 ngày + dòng «nến …» đẩy trang rộng thêm 30px) */
#trThiTruong .nd-tg > *{min-width:0}
#trThiTruong .nd-tg .nd-khung{overflow-x:auto; white-space:normal}
#trThiTruong .nd-tg .nd-bang-nho th{white-space:normal}
#trThiTruong .nd-khung{background:var(--panel); border:1px solid var(--line); padding:10px 12px}
#trThiTruong .nd-khung + .nd-khung{margin-top:10px}
#trThiTruong .nd-khung-dau{display:flex; flex-wrap:wrap; align-items:center; gap:4px 12px; margin:0 0 6px; font-size:12.5px; font-weight:600; color:var(--txt)}
#trThiTruong .nd-chu-giai{display:inline-flex; align-items:center; gap:10px; font-weight:400; color:var(--dim); margin-left:auto}
#trThiTruong .nd-chu-giai i{display:inline-block; width:14px; height:3px; vertical-align:3px; margin-right:4px}
#trThiTruong .nd-bd{position:relative}
#trThiTruong .nd-bd svg{display:block; width:100%}
#trThiTruong .nd-bd .nd-goi{position:absolute; pointer-events:none; padding:5px 8px; background:var(--tooltip-bg); color:#fff; font-size:11.5px; line-height:1.5; white-space:nowrap; display:none; z-index:3}
#trThiTruong .nd-o{display:grid; grid-template-columns:repeat(auto-fill,minmax(140px,1fr)); gap:8px 14px}
#trThiTruong .nd-o > div{border-left:2px solid var(--line); padding:1px 0 1px 9px}
#trThiTruong .nd-o b{display:block; font-size:16px; font-variant-numeric:tabular-nums; color:var(--txt)}
#trThiTruong .nd-o span{font-size:11.5px; color:var(--dim)}
#trThiTruong .nd-dong{font-size:12.5px; line-height:1.7; color:var(--dim)}
#trThiTruong .nd-dong b{color:var(--txt)}
#trThiTruong .nd-bang-nho{width:100%; min-width:0; border-collapse:collapse; font-size:12px; font-variant-numeric:tabular-nums}
#trThiTruong .nd-bang-nho th{font-size:11px; font-weight:600; color:var(--dim); text-align:right; padding:4px 6px; border-bottom:1px solid var(--line); white-space:nowrap}
#trThiTruong .nd-bang-nho th:first-child, #trThiTruong .nd-bang-nho td:first-child{text-align:left}
#trThiTruong .nd-bang-nho td{text-align:right; padding:5px 6px; border-bottom:1px solid var(--line-soft); white-space:nowrap}
/* ④ phễu */
#trThiTruong .nd-pheu-luoi{display:grid; grid-template-columns:minmax(0,2fr) minmax(300px,1fr); gap:12px; align-items:start; margin-bottom:12px}
#trThiTruong .nd-pheu-hang{display:grid; grid-template-columns:230px minmax(0,1fr) 64px; align-items:center; gap:10px; padding:6px 0; border-bottom:1px solid var(--line-soft)}
#trThiTruong .nd-pheu-hang:last-child{border-bottom:0}
#trThiTruong .nd-pheu-ten{font-size:12.5px; font-weight:600; color:var(--txt)}
#trThiTruong .nd-pheu-ten small{display:block; font-weight:400; color:var(--dim2); font-size:11.5px}
#trThiTruong .nd-pheu-thanh{display:flex; height:22px; background:var(--line-soft)}
#trThiTruong .nd-khuc{display:flex; align-items:center; justify-content:center; min-width:3px; height:100%; overflow:hidden; white-space:nowrap; font-size:11px; font-weight:600; color:#fff; cursor:pointer; border-right:1px solid var(--panel)}
#trThiTruong .nd-khuc:hover{filter:brightness(1.12)}
#trThiTruong .nd-khuc.chon{outline:2px solid var(--txt); outline-offset:-2px}
#trThiTruong .nd-pheu-so{text-align:right; font-size:14px; font-weight:700; font-variant-numeric:tabular-nums; color:var(--txt)}
#trThiTruong .nd-pheu-giai{grid-column:2 / 4; display:flex; flex-wrap:wrap; gap:2px 12px; font-size:11.5px; color:var(--dim)}
#trThiTruong .nd-pheu-giai span{display:inline-flex; align-items:center; gap:4px; cursor:pointer}
#trThiTruong .nd-pheu-giai i{display:inline-block; width:9px; height:9px}
#trThiTruong .nd-pheu-giai span:hover{color:var(--cool)}
#trThiTruong .nd-cot-san{display:grid; grid-template-columns:70px minmax(0,1fr) 44px; align-items:center; gap:8px; font-size:12px; margin:3px 0}
#trThiTruong .nd-cot-san div:nth-child(2){height:10px; background:var(--line-soft)}
#trThiTruong .nd-cot-san div:nth-child(2) i{display:block; height:100%; background:var(--cool)}
#trThiTruong .nd-cot-san div:last-child{text-align:right; font-variant-numeric:tabular-nums}
/* ⑤ */
#trThiTruong .nd-sk{display:grid; grid-template-columns:minmax(330px,1fr) minmax(0,1.6fr); gap:12px; align-items:start}
#trThiTruong .nd-pb{display:flex; height:16px; margin:8px 0 4px; background:var(--line-soft)}
#trThiTruong .nd-pb i{display:block; height:100%; border-right:1px solid var(--panel)}
#trThiTruong .nd-the-nho{display:inline-block; padding:0 7px; border-radius:999px; font-size:11px; font-weight:600; line-height:18px; background:#FFF7E6; color:var(--gold)}
#trThiTruong .nd-chan{margin:22px 0 30px; font-size:12px; color:var(--dim2)}
@media (max-width:1100px){ #trThiTruong .nd-tg, #trThiTruong .nd-pheu-luoi, #trThiTruong .nd-sk{grid-template-columns:1fr} }
/* thân hộp ghi chú (khung chung #ghiChuNen) — chữ từ tệp ghi chú md + chấm đèn trong hộp của một việc.
   Bó trong .nd-ghi-chu (DataSourcesSection bọc thân hộp) để không đổi hộp ghi chú của các trang khác. */
#ghiChuNoiDung .nd-ghi-chu code{font-family:var(--mono); font-size:.9em; background:var(--line-soft); padding:0 4px}
#ghiChuNoiDung .nd-ghi-chu ul, #ghiChuNoiDung .nd-ghi-chu ol{margin:0 0 12px; padding-left:22px}
#ghiChuNoiDung .nd-ghi-chu li{margin:3px 0}
#ghiChuNoiDung .nd-ghi-chu .nd-ghi{padding:8px 12px; background:#FFF7E6; border-left:3px solid var(--gold)}
/* chế độ tối: 4 nền sáng cố định ở trên (#FFF7E6 · #ECFDF5) đổi sang nền tối nhạt, giữ chữ màu nhấn */
[data-theme="dark"] #ghiChuNoiDung .nd-ghi-chu .nd-ghi,
[data-theme="dark"] #trThiTruong .nd-nhan-top,
[data-theme="dark"] #trThiTruong .nd-nhan-mong,
[data-theme="dark"] #trThiTruong .nd-the-nho{background:var(--line-soft)}
#ghiChuNoiDung .nd-ghi-chu .nd-nguon-gc{margin-top:14px; padding-top:8px; border-top:1px solid var(--line); font-size:12.5px; color:var(--dim2)}
#ghiChuNoiDung .nd-ghi-chu .nd-den{display:inline-block; width:9px; height:9px; border-radius:50%; vertical-align:middle}
#trThiTruong .nd-nut:disabled{opacity:.6; cursor:default}
/* ===== HẾT MẶT «NGUỒN DỮ LIỆU» ===== */

/* ===== TAB GIAO DỊCH — KHUNG «GIAO DỊCH VỪA GHI GẦN ĐÂY» (31/10/2026, anh duyệt mockup): dáng y «Việc vừa làm gần đây» trang Quỹ ===== */
#trGiaodich .gd-ganday{margin-top:22px}
#trGiaodich .gd-ganday-tt{display:flex; align-items:center; justify-content:space-between; gap:10px; margin:0 0 10px;
  font-size:13.5px; font-weight:700; letter-spacing:.02em; color:var(--txt)}
#trGiaodich .gd-ganday-tt > span{display:inline-flex; align-items:center; gap:6px}
#trGiaodich .gd-ganday-congcu{display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-bottom:10px}
#trGiaodich .gd-ganday-tim{position:relative; flex:0 1 330px; min-width:200px}
#trGiaodich .gd-ganday-tim input{width:100%; box-sizing:border-box; font:inherit; font-size:13.5px; padding:7px 10px 7px 30px;
  border:1px solid var(--line); border-radius:8px; background:var(--panel); color:var(--txt)}
#trGiaodich .gd-ganday-tim-icon{position:absolute; left:9px; top:50%; transform:translateY(-50%); width:15px; height:15px;
  fill:none; stroke:var(--dim); stroke-width:2; stroke-linecap:round; pointer-events:none}
#trGiaodich .gd-ganday-congcu select{font:inherit; font-size:13.5px; padding:7px 10px; min-width:170px; border:1px solid var(--line);
  border-radius:8px; background:var(--panel); color:var(--txt)}
#trGiaodich .gd-ganday-tim input:focus, #trGiaodich .gd-ganday-congcu select:focus{outline:none; border-color:var(--cool); box-shadow:0 0 0 3px var(--cool-soft)}
#trGiaodich .gd-ganday-bang table{font-size:13px}
#trGiaodich .gd-ganday-gio{white-space:nowrap; font-variant-numeric:tabular-nums}
#trGiaodich .gd-ganday-ma{font-family:var(--mono); font-size:12.5px; color:var(--dim); white-space:nowrap}
#trGiaodich .gd-ganday-bang td.p{white-space:nowrap; font-variant-numeric:tabular-nums}
#trGiaodich .gd-ganday-ghichu{max-width:320px; overflow-wrap:anywhere; color:var(--dim)}
#trGiaodich .gd-ganday-bang tr.gd-ganday-huy td:not(:nth-child(2)){color:var(--dim2)}
#trGiaodich .gd-ganday-nhan{display:inline-block; padding:1px 9px; border-radius:999px; font-size:12.5px; font-weight:600; line-height:1.6; white-space:nowrap}
#trGiaodich .gd-ganday-nhan.is-create{background:var(--txt); color:var(--panel)}
#trGiaodich .gd-ganday-nhan.is-void{background:var(--down-soft); color:var(--down)}
#trGiaodich .gd-ganday-nhan.is-update{background:color-mix(in srgb, var(--gold) 14%, transparent); color:var(--gold)}
#trGiaodich .gd-ganday-nhan.is-import{background:var(--cool-soft); color:var(--cool)}
#trGiaodich .gd-ganday-nhan.is-other{background:var(--line-soft); color:var(--dim)}
#trGiaodich .gd-ganday-mo{margin:10px 2px; font-size:13.5px; color:var(--dim)}
#trGiaodich .gd-ganday-chan{display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; margin-top:8px;
  font-size:12.5px; color:var(--dim2)}
#trGiaodich .gd-ganday-trang{display:flex; align-items:center; gap:8px; font-size:13.5px; color:var(--dim)}
#trGiaodich .gd-ganday-trang button:disabled{opacity:.45; cursor:default}
/* ===== HẾT KHUNG «GIAO DỊCH VỪA GHI GẦN ĐÂY» ===== */

/* ===== NÚT «HUỶ» CẠNH 🗑 TRÊN DÒNG ĐANG GÕ — tab Giao dịch (31/10/2026) ===== */
#trGiaodich td.hang-cho-nut{white-space:nowrap}
#trGiaodich td.hang-cho-nut .nut-link{margin-right:4px}

/* ===== 📎 BIÊN LAI TỪNG LỆNH — tab Giao dịch, danh mục quỹ (01/11/2026). Menu + khung xem dùng chung kiểu trang Quỹ (.quy-menu · .quy-xem-tep) ===== */
#trGiaodich .hd .gd-tep{position:relative; display:inline-flex}
/* menu nổi kiểu trang Quỹ (#trQuy .quy-menu): fixed + toạ độ do quy/files/rowMenu.ts placeRowMenu đặt ⇒ thoát khung cuộn .con-scroll */
#trGiaodich .gd-tep .quy-menu{position:fixed; right:auto; top:auto; z-index:900}
#trGiaodich .hd .gd-tep > button{width:auto; min-width:26px; padding:0 4px; box-sizing:border-box; justify-content:center; white-space:nowrap; line-height:1}
#trGiaodich .hd .gd-tep > button.gd-tep-trong{opacity:.4}
#trGiaodich .hd .gd-tep > button.gd-tep-trong:hover{opacity:1}
/* (02/11/2026) ×N xuống dòng 2 dưới 📎 ⇒ cột Chỉnh sửa/Xóa không phình ngang */
#trGiaodich .gd-tep-dem{display:block; font-size:9.5px; line-height:1; font-weight:700; text-align:center}
/* (02/11/2026) đầu cột tab Giao dịch: chữ + mũi tên ⇅ một cụm không ngắt dòng ⇒ đầu cột tối đa 2 dòng (chữ⇅ / đơn vị) */
#trGiaodich th .th-dong{white-space:nowrap}
/* .hd button (26px vuông) không được bó các mục của menu */
#trGiaodich .hd .quy-menu button{width:auto; height:auto; padding:8px 12px; border-radius:0; display:block; text-align:left; white-space:nowrap}
#trGiaodich .gd-tep-bao{margin:8px 0 0; font-size:13px; color:var(--dim)}
#trGiaodich .gd-tep-bao.loi{color:var(--down)}

/* ===== 📊 HOẠT ĐỘNG + 💬 GÓP Ý (02/11/2026 — mockup chukyvang/Mockups/mockup-hoat-dong-nguoi-dung-v1.html, anh duyệt) =====
   Trang /hoat-dong (src/hoatdong/*) · hộp góp ý (src/shared/activity/FeedbackForm.tsx + FeedbackDialog.tsx) · số chưa đọc ở menu trái.
   Luật giao diện: khung / bảng / thẻ GÓC VUÔNG, nút bấm giữ bo · dải số = thanh dọc mờ đầu mỗi số, không hộp · trang co giãn hết bề ngang ·
   chữ bảng nhỏ · màu đi theo token (--line --panel --dim --cool …) ⇒ nền tối tự đổi. */
/* màn riêng này không bó 1100px như Tài khoản / Quản trị — co giãn hết bề ngang */
body.man-rieng.activity-screen .noidung{max-width:none}
#trHoatDong{min-width:0}
#trHoatDong .activity-page{max-width:none}
/* số góp ý chưa đọc — cạnh "📊 Hoạt động" ở menu trái + cạnh tab 💬 Góp ý */
.activity-unread{display:inline-block; margin-left:4px; padding:0 6px; font-size:11.5px; font-weight:600; line-height:1.6; color:#fff; background:var(--down); border-radius:999px}
.activity-unread[hidden]{display:none}
/* tab con */
.activity-tabs{display:flex; gap:20px; border-bottom:1px solid var(--line); margin:4px 0 12px; flex-wrap:wrap}
.activity-tabs button{all:unset; cursor:pointer; padding:7px 2px; margin-bottom:-1px; border-bottom:2px solid transparent; font-size:14px; font-weight:600; color:var(--dim)}
.activity-tabs button.is-current{border-bottom-color:var(--cool); color:var(--cool)}
.activity-tabs button:focus-visible{outline:2px solid var(--cool); outline-offset:2px}
/* dải số */
.activity-stats{display:flex; flex-wrap:wrap; row-gap:8px; margin:6px 0 14px}
.activity-stat{padding:2px 16px; border-left:1px solid var(--line); min-width:110px}
.activity-stat:first-child{border-left:none; padding-left:0}
.activity-stat-label{font-size:11.5px; color:var(--dim)}
.activity-stat-value{font-size:17px; font-weight:700; font-variant-numeric:tabular-nums}
.activity-stat-value.is-bad{color:var(--down)}
.activity-stat-sub{font-size:11px; color:var(--dim2)}
/* khung + lưới hai cột */
.activity-grid{display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:8px}
@media (max-width:900px){ .activity-grid{grid-template-columns:1fr} }
.activity-panel{border:1px solid var(--line); background:var(--panel); padding:10px 12px; border-radius:0; min-width:0}
.activity-panel-wide{margin-bottom:8px}
.activity-panel h4{margin:0 0 8px; font-size:13.5px}
/* bảng nhỏ trong khung — gỡ luật toàn cục table{min-width:900px} */
table.activity-table, table.activity-timeline{min-width:0; width:100%; border-collapse:collapse; font-size:12.5px}
table.activity-table th{text-align:left; font-weight:600; color:var(--dim); border-bottom:1px solid var(--line); padding:5px 6px; font-size:12px}
table.activity-table td{border-bottom:1px solid var(--line-soft); padding:5px 6px; vertical-align:top}
table.activity-table .is-num{text-align:right; white-space:nowrap; font-variant-numeric:tabular-nums}
table.activity-table tr.is-dim td{color:var(--dim2)}
.activity-bar{display:inline-block; height:7px; background:var(--cool); opacity:.55; border-radius:4px; vertical-align:middle; margin-right:6px}
.activity-dim{color:var(--dim2); font-size:11.5px}
/* cột "số người vào mỗi ngày" */
.activity-columns{display:flex; align-items:flex-end; gap:3px; height:110px; border-bottom:1px solid var(--line); padding-top:6px}
.activity-column{flex:1; background:var(--cool); opacity:.6; min-width:3px; min-height:1px}
.activity-column.is-weekend{opacity:.3}
.activity-axis{display:flex; justify-content:space-between; font-size:11px; color:var(--dim2); margin-top:3px}
/* chữ báo */
.activity-note{margin:8px 0; font-size:13px; color:var(--dim)}
.activity-note.is-error{color:var(--down)}
.activity-link{all:unset; cursor:pointer; color:var(--cool); text-decoration:underline; font-size:12.5px}
.activity-link:focus-visible{outline:2px solid var(--cool); outline-offset:2px}
/* nhãn nhỏ (loại / trạng thái góp ý) */
.activity-chip{display:inline-block; font-size:11px; padding:1px 8px; border-radius:10px; border:1px solid var(--line); white-space:nowrap; background:var(--line-soft); color:var(--dim)}
.activity-chip.is-bug{background:var(--down-soft); color:var(--down); border-color:transparent}
.activity-chip.is-idea{background:var(--cool-soft); color:var(--cool); border-color:transparent}
.activity-chip.is-unread{background:color-mix(in srgb, var(--gold) 16%, transparent); color:var(--gold); border-color:transparent}
.activity-chip.is-done{background:color-mix(in srgb, var(--up) 14%, transparent); color:var(--up); border-color:transparent}
/* ① danh sách góp ý */
.activity-feedback{border-bottom:1px solid var(--line); padding:10px 0}
.activity-feedback.is-unread{border-left:3px solid var(--gold); padding-left:10px}
.activity-feedback-head{display:flex; gap:8px; align-items:center; flex-wrap:wrap; font-size:12.5px}
.activity-feedback-who{font-weight:600}
.activity-feedback-who.is-gone{font-weight:400; color:var(--dim2)}
.activity-feedback-meta{color:var(--dim2)}
.activity-feedback-message{margin:6px 0; font-size:13.5px; white-space:pre-wrap; overflow-wrap:anywhere}
.activity-feedback-foot{display:flex; gap:14px; align-items:center; font-size:12px}
.activity-status-select{font-size:12px; padding:2px 4px}
/* ③ dòng thời gian từng người */
.activity-history{margin:0 0 10px}
.activity-visit{margin:0 0 12px}
.activity-visit.is-focused{outline:2px solid var(--cool-soft); outline-offset:4px}
.activity-visit-head{font-size:12.5px; font-weight:600; padding:6px 0; border-bottom:1px solid var(--line); display:flex; gap:10px; flex-wrap:wrap}
.activity-visit-meta{font-weight:400; color:var(--dim2)}
table.activity-timeline td{padding:4px 6px; border-bottom:1px solid var(--line-soft)}
table.activity-timeline td.activity-time{width:70px; color:var(--dim2); font-variant-numeric:tabular-nums; white-space:nowrap}
table.activity-timeline td.activity-stay{width:90px; text-align:right; color:var(--dim2); white-space:nowrap}
table.activity-timeline tr.is-error td{background:var(--down-soft)}
table.activity-timeline tr.is-feedback td{background:color-mix(in srgb, var(--gold) 12%, transparent)}
table.activity-timeline tr.is-target td{font-weight:600}
/* hộp góp ý — máy tính (nổi giữa trang) + điện thoại (/m/gop-y) */
.activity-dialog-backdrop{position:fixed; inset:0; z-index:950; background:rgba(15,23,42,.45); display:flex; align-items:flex-start; justify-content:center; padding:80px 16px 16px; overflow:auto}
.activity-dialog{background:var(--panel); color:var(--txt); border:1px solid var(--line); border-radius:0; width:440px; max-width:100%; padding:16px; box-sizing:border-box}
.activity-dialog h3{margin:0 0 10px; font-size:15px}
.activity-feedback-kinds{display:flex; gap:14px; font-size:13px; margin-bottom:8px; flex-wrap:wrap}
.activity-feedback-kinds label{display:inline-flex; align-items:center; gap:4px; cursor:pointer}
.activity-feedback-text{width:100%; box-sizing:border-box; height:110px; font:inherit; font-size:13px; padding:8px; border:1px solid var(--line); border-radius:0; background:var(--ink); color:var(--txt); resize:vertical}
.activity-feedback-form.is-compact .activity-feedback-text{height:160px}
.activity-feedback-attach{font-size:11.5px; color:var(--dim2); margin:6px 0 10px}
.activity-feedback-error{margin:0 0 8px; font-size:12.5px; color:var(--down)}
.activity-feedback-actions{display:flex; justify-content:space-between; align-items:center; gap:8px}
.activity-feedback-count{font-size:11.5px; color:var(--dim2)}
.activity-feedback-send, .activity-feedback-cancel{font:inherit; font-size:13px; padding:6px 14px; border-radius:6px; border:1px solid var(--cool); background:var(--cool); color:#fff; cursor:pointer}
.activity-feedback-cancel{background:none; color:var(--txt); border-color:var(--line)}
.activity-feedback-send:disabled{opacity:.55; cursor:default}
.activity-feedback-form.is-compact .activity-feedback-send{width:100%}
.activity-toast{position:fixed; left:50%; bottom:24px; transform:translateX(-50%); z-index:960; max-width:calc(100vw - 32px); padding:8px 14px; background:color-mix(in srgb, var(--up) 14%, var(--panel)); color:var(--up); border:1px solid var(--up); border-radius:10px; font-size:13px}
/* ===== HẾT KHỐI 📊 HOẠT ĐỘNG + 💬 GÓP Ý ===== */

/* ===== DÒNG ĐỎ SAU LỆNH CỨU 2FA (passkey nhịp 3, 03/11/2026 — app/TwoFactorResetNotice.tsx): nền + chữ đỏ mượn .dn-loi, ở đây chỉ xếp hàng ===== */
.two-factor-reset-notice{display:flex; flex-wrap:wrap; align-items:center; gap:6px 12px; margin:8px 12px; border-radius:0}
.two-factor-reset-notice .dn-nut{padding:4px 14px; font-size:13px}
.two-factor-reset-notice-error{flex-basis:100%; font-size:12.5px}

/* ===== TAB THỊ TRƯỜNG KHÁC (04/11/2026 — ThiTruongKhacPage.tsx, khối #trThiTruongKhac). Khung y tab Thành phần: luật chung ăn theo
   `:is(#trTaifu,#tang2,#trThiTruong,#trThiTruongKhac)`; dưới đây chép các luật RIÊNG của `#trTaifu` cho khu bảng th-3 + khu nến th-4. ===== */
#trThiTruongKhac{ --khu-h: clamp(440px, calc(100vh - var(--t1-h) - 76px), 758px); }
@media (max-width:760px){ #trThiTruongKhac{ --khu-h: 600px; } }
#trThiTruongKhac .th-3, #trThiTruongKhac .th-4{ display:flex; flex-direction:column; height:var(--khu-h); padding:0; box-sizing:border-box; }
#trThiTruongKhac .th-3 .bang{ flex:1; min-height:0; max-height:none; height:auto; overflow:auto; }
#trThiTruongKhac .th-3 .tf-bang thead th{ position:sticky; top:0; background:var(--panel); z-index:2; }
/* bảng 7 cột: không cần bề ngang tối thiểu 1080px của bảng danh mục */
#trThiTruongKhac .th-khu .tf-bang table.tf-b-dm{ min-width:0; }
#trThiTruongKhac #ttkBang tbody tr.coin-row{ cursor:pointer; }
#trThiTruongKhac #ttkBang tbody tr.coin-row:hover td{ background:rgba(127,127,127,.08); }
#trThiTruongKhac #ttkBang tbody tr.coin-row.is-selected td{ background:rgba(240,185,11,.16); }
#trThiTruongKhac #ttkBang tbody tr.coin-row.is-selected td:first-child{ box-shadow:inset 3px 0 0 var(--gold,#f0b90b); }
#trThiTruongKhac .th-4 .tf-chart-card{ min-width:0; }
#trThiTruongKhac .th-4 .coin-chart-name{ flex:none; font-size:13.5px; font-weight:700; color:var(--txt); padding-right:4px; white-space:nowrap; }
@media (max-width:760px){ #trThiTruongKhac .th-4{ height:auto; } }
/* ⛶ bung khu bảng: cùng bộ thuộc tính `#trTaifu .th-3.tf-full`, góc vuông */
#trThiTruongKhac .th-3.tf-full{ position:fixed; inset:0; z-index:60; margin:0; max-width:none; height:auto; background:var(--ink); border-radius:0; padding:16px 18px; box-shadow:none; overflow:auto; }
#trThiTruongKhac .th-3.tf-full .bang{ max-height:none; }
/* ===== HẾT KHỐI THỊ TRƯỜNG KHÁC ===== */