/*
 * CSS widget "Ngày Tốt Xấu" — dùng LẠI bộ design token (màu/font/bo góc)
 * của plugin Client (tuvi-do-nhat-client/assets/css/tuvi.css) để đồng bộ
 * giao diện toàn hệ thống. Khai báo lại :root ở đây (namespace riêng
 * --ntx-*) để widget này chạy độc lập được, không bắt buộc phải cài
 * chung site với plugin Client.
 *
 * FONT: "Be Vietnam Pro" (thân bài — sans hiện đại, hỗ trợ đầy đủ dấu
 * tiếng Việt, dễ đọc trên mọi kích thước) kết hợp "Cormorant Garamond"
 * (tiêu đề — serif cổ điển, có subset Vietnamese, tạo cảm giác trang
 * trọng/truyền thống hợp chủ đề "Lịch Vạn Niên") — 2 font Google Fonts,
 * tải qua @import bên dưới, có fallback hệ thống nếu mạng chậm/chặn. */
@import url('https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:wght@400;500;600;700;800&family=Cormorant+Garamond:wght@500;600;700&display=swap');
.tuvi-ntx-wrap {
  /* "Giấy Dó — Light Theme" — nền kem giấy dó ấm, Đỏ Đô là accent chính
     (tiêu đề, viền, nền nút bấm), Vàng Đồng dùng cho badge/nhấn phụ, chữ
     thân dùng tông nâu đen ấm để không gắt mắt trên nền sáng. */
  --ntx-bg-main:     #E3D8BE;   /* Nền chủ đạo toàn trang (Kem Giấy Dó) */
  --ntx-primary:     #521414;   /* Đỏ Đô chính — dùng cho tiêu đề, viền, nền nút bấm (theo mã màu mẫu) */
  --ntx-ink:         #E3D8BE;   /* Chữ Kem hiển thị TRÊN nền Đỏ Đô (nút bấm, chip active...) */
  --ntx-gold:        #B88A22;   /* Vàng Đồng — viền hairline, active border, icon/badge */
  --ntx-gold-light:  #F2E5C4;   /* Vàng nhạt — highlight, hover */
  --ntx-gold-ink:    #B88A22;   /* Vàng Đồng dùng cho chữ nhỏ trên nền sáng, vẫn đủ tương phản */
  --ntx-bg:          #FAF4E8;   /* Nền khối nội dung / Card */
  --ntx-bg-hover:    #FFFFFF;   /* Nền Card khi hover */
  --ntx-bg-page:     #E3D8BE;   /* Nền tổng thể trang (= bg-main) */
  --ntx-border:      rgba(82,20,20,.12);  /* Viền mỏng Đỏ Đô, tinh tế */
  --ntx-text:        #1C1514;   /* Text chính — đen gỗ trắc, tránh #000 thuần */
  --ntx-text-muted:  #5C4E4B;   /* Text phụ — nâu xám trầm */
  --ntx-text-disabled: #9E8F8B; /* Text ẩn / disabled */

  /* Hệ màu trạng thái DUY NHẤT — bản tương thích Light Theme, dùng đồng bộ
     cho mọi nơi biểu đạt tốt/bình thường/xấu. */
  --ntx-good:        #1E6B37;   /* Xanh lục bảo đậm — tốt (Ngày Hoàng Đạo / Nên làm) */
  --ntx-good-bg:      #E2F0E5;
  --ntx-good-border:  rgba(30,107,55,.35);
  --ntx-neutral2:    #A36200;   /* Vàng hổ phách — bình thường */
  --ntx-neutral2-bg:  #FAF0DF;
  --ntx-neutral2-border: rgba(163,98,0,.35);
  --ntx-bad:         #B71C1C;   /* Đỏ nhung đậm — xấu (Ngày Hắc Đạo / Kiêng) */
  --ntx-bad-bg:       #F9E8E8;
  --ntx-bad-border:   rgba(183,28,28,.35);
  --ntx-nodata:      #5C4E4B;   /* tông text phụ — chưa có dữ liệu */
  --ntx-nodata-bg:    rgba(92,78,75,.08);
  --ntx-nodata-border: rgba(92,78,75,.25);

  /* A3 (bản sửa 2026-07-24): tín hiệu "hôm nay" — xanh lá emerald, CỐ TÌNH
     khác tông với --ntx-good (xanh lục bảo đậm, dùng cho ý nghĩa
     "Hoàng Đạo/tốt") để không bị hiểu nhầm "hôm nay" = "ngày tốt". Dùng
     làm màu viền mảnh + nền wash tĩnh (::before) cho ô "hôm nay" trong
     lịch tháng — không còn animation (bản glow nhấp nháy trước đó bị
     đánh giá "phèn", đã bỏ). */
  --ntx-today-ring:      #22C55E;

  --ntx-success:     var(--ntx-good);
  --ntx-error:       var(--ntx-bad);
  --ntx-error-bg:    var(--ntx-bad-bg);
  --ntx-radius:      10px;
  --ntx-radius-sm:   6px;
  --ntx-radius-lg:   16px;
  --ntx-shadow-premium: 0 8px 24px rgba(82,20,20,.12), 0 1px 2px rgba(0,0,0,.04);
  --ntx-font:        'Be Vietnam Pro', 'Inter', 'Segoe UI', Arial, sans-serif;
  --ntx-font-title:  'Cormorant Garamond', 'Be Vietnam Pro', Georgia, serif;
  --ntx-font-mono:   'Inter', 'Be Vietnam Pro', 'Segoe UI', Arial, sans-serif;

  /* ── Nền Đỏ Đô DÙNG CHUNG — mọi phần "bo khung" bên ngoài nội dung đọc
     (tiêu đề trang, thanh tiêu đề từng khối, badge, nút bấm chọn) đều
     lấy đúng 1 cặp token này để đồng bộ tuyệt đối trong toàn giao diện:
     nền Đỏ Đô + chữ Vàng Kim. Không tự chế thêm biến màu nền nào khác
     cho các phần này ngoài 2 token dưới đây. */
  --ntx-maroon-bg:      var(--ntx-primary);
  --ntx-maroon-bg-dark: #3A0D0D;   /* điểm cuối gradient — tối hơn maroon-bg 1 chút để tạo chiều sâu, không tối quá như trước */
  --ntx-maroon-text:    #E9C468;   /* Vàng Kim — chữ trên nền Đỏ Đô, sáng & ấm hơn --ntx-gold thường để dễ đọc trên nền tối */
  --ntx-maroon-border:  #7A2424;   /* viền tinh tế giữa 2 sắc Đỏ Đô, tạo chiều sâu nhẹ cho khối nền phẳng */

  /* ── Bóng nút kiểu "đúc/mạ kim loại" — nguồn sáng từ trên (inset highlight
     trắng mờ ở mép trên), inner shadow rất nhẹ ở mép dưới tạo chiều sâu,
     bóng ngoài mềm/blur lớn thay vì 1 đường viền tối dày, màu bóng dùng
     nâu đậm/vàng nâu thay vì đen thui — áp dụng đồng bộ cho MỌI nút bấm. */
  --ntx-shadow-gold-btn:         inset 0 1px 1px rgba(255,255,255,.6), inset 0 -2px 3px rgba(120,60,0,.15), 0 2px 0 rgba(120,70,0,.30), 0 8px 16px rgba(90,50,10,.16);
  --ntx-shadow-gold-btn-hover:   inset 0 1px 1px rgba(255,255,255,.65), inset 0 -2px 3px rgba(120,60,0,.18), 0 3px 0 rgba(120,70,0,.34), 0 10px 20px rgba(90,50,10,.20);
  --ntx-shadow-gold-btn-active:  inset 0 2px 4px rgba(120,60,0,.28), 0 1px 0 rgba(120,70,0,.25);
  --ntx-shadow-maroon-btn:       inset 0 1px 1px rgba(255,255,255,.22), inset 0 -2px 3px rgba(20,4,4,.30), 0 2px 0 rgba(60,15,15,.35), 0 8px 16px rgba(40,10,10,.20);
  --ntx-shadow-maroon-btn-hover: inset 0 1px 1px rgba(255,255,255,.28), inset 0 -2px 3px rgba(20,4,4,.34), 0 3px 0 rgba(60,15,15,.40), 0 10px 20px rgba(40,10,10,.24);
  --ntx-shadow-maroon-btn-active:inset 0 2px 4px rgba(20,4,4,.40), 0 1px 0 rgba(60,15,15,.30);

  font-family: var(--ntx-font);
  font-variant-numeric: tabular-nums;
  color: var(--ntx-text);
  max-width: 560px;
  width: 100%;
  margin: 0 auto;
  background: var(--ntx-bg-page);
  box-sizing: border-box;
  overflow-x: hidden;
  position: relative;
  isolation: isolate; /* tạo stacking context riêng — theme không thể đè z-index lên widget */
}.tuvi-ntx-wrap, .tuvi-ntx-wrap *, .tuvi-ntx-wrap *::before, .tuvi-ntx-wrap *::after {
  box-sizing: border-box;
}

/* ═══════════════════════════════════════════════════
   "KHIÊN CHỐNG THEME" (Theme reset)
   Nhiều theme WordPress style thẳng vào thẻ HTML gốc
   (button, ul li, a, h1-h6, table...) bằng selector ghép
   nhiều lớp — VD: `.entry-content ul li`, `article button`,
   `.post-content a` — độ đặc hiệu (specificity) của các
   selector đó có thể CAO HƠN các class đơn của widget này
   nếu không được reset trước. Khối dưới đây "gạt" mọi kiểu
   dáng kế thừa từ theme về mặc định trung tính TRƯỚC KHI
   các rule riêng của widget (đã được tự động thêm tiền tố
   `.tuvi-ntx-wrap` ở trên) áp dụng đè lên sau — thứ tự
   nguồn (source order) đảm bảo widget luôn thắng ở specificity
   ngang nhau, còn khối reset này đảm bảo thắng cả khi theme
   dùng selector ghép dài hơn 1 class. */
.tuvi-ntx-wrap button,
.tuvi-ntx-wrap input,
.tuvi-ntx-wrap select,
.tuvi-ntx-wrap textarea {
  all: revert;
  box-sizing: border-box;
  font-family: var(--ntx-font);
  margin: 0;
}
.tuvi-ntx-wrap ul,
.tuvi-ntx-wrap ol {
  all: revert;
  box-sizing: border-box;
}
.tuvi-ntx-wrap li { box-sizing: border-box; }
.tuvi-ntx-wrap a {
  text-decoration: none;
  color: inherit;
  cursor: pointer;
}
.tuvi-ntx-wrap h1,
.tuvi-ntx-wrap h2,
.tuvi-ntx-wrap h3,
.tuvi-ntx-wrap h4,
.tuvi-ntx-wrap h5,
.tuvi-ntx-wrap h6,
.tuvi-ntx-wrap p {
  margin: 0;
  font-family: var(--ntx-font);
  line-height: normal;
}
.tuvi-ntx-wrap table {
  border-collapse: collapse;
  width: auto;
}
/* Một số theme set `line-height` hoặc `letter-spacing` toàn cục rất lớn
   trên <body>/<article> khiến chữ trong widget bị giãn dòng bất thường
   dù CSS của widget đã khai rõ line-height riêng ở từng chỗ — ép lại
   line-height gốc trung tính ngay tại wrapper để mọi phần tử con kế
   thừa đúng giá trị của widget, không phải của theme. */
.tuvi-ntx-wrap {
  line-height: 1.5;
  letter-spacing: normal;
  text-transform: none;
}.tuvi-ntx-wrap img { max-width: 100%; height: auto; }.tuvi-ntx-wrap .tuvi-ntx-card {
  background: var(--ntx-bg);
  border: 1px solid var(--ntx-border);
  border-radius: var(--ntx-radius);
  box-shadow: 0 2px 18px rgba(15,23,42,.06);
  padding: 24px;
}

/* Header — banner nền Đỏ Đô full-width, bo góc, chữ Vàng Kim, CĂN GIỮA
   toàn bộ nội dung (kicker + tiêu đề). Đây chính là khối "mở màn" định
   hình tông màu cho toàn bộ giao diện bên dưới: mọi thanh tiêu đề khối,
   badge, nút bấm chọn đều lấy lại đúng cặp nền/chữ này (xem
   --ntx-maroon-bg / --ntx-maroon-text ở :root). */.tuvi-ntx-wrap .ntx-page-head-compact {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 4px;
  text-align: center;
  margin-bottom: 18px;
  padding: 18px 20px;
  background: linear-gradient(155deg, var(--ntx-maroon-bg) 0%, var(--ntx-maroon-bg-dark) 100%);
  border-radius: var(--ntx-radius-lg);
  border: 1px solid var(--ntx-maroon-border);
  box-shadow: 0 6px 20px rgba(82,20,20,.28), inset 0 1px 0 rgba(233,196,104,.08);
  position: relative;
  overflow: hidden;
}.tuvi-ntx-wrap .ntx-page-head-compact::before {
  /* Viền chỉ Vàng Kim mảnh phía dưới — điểm nhấn trang trọng kiểu "ấn triện" */
  content: '';
  position: absolute; left: 20px; right: 20px; bottom: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent 0%, var(--ntx-gold) 50%, transparent 100%);
  opacity: .55;
}.tuvi-ntx-wrap .ntx-page-kicker-inline {
  font-size: 13.5px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--ntx-maroon-text);
  opacity: 1;
  font-weight: 800;
  font-family: var(--ntx-font);
  margin-bottom: 2px;
  text-shadow: 0 0 12px rgba(233,196,104,.45);
}.tuvi-ntx-wrap .ntx-page-title-compact {
  font-family: var(--ntx-font-title);
  font-weight: 700;
  font-size: 24px;
  line-height: 1.2;
  color: #FBEFD4;
  margin: 0;
  letter-spacing: .01em;
}.tuvi-ntx-wrap .tuvi-ntx-title {
  font-family: var(--ntx-font-title);
  font-weight: 700;
  font-size: 24px;
  color: var(--ntx-primary);
  margin: 0 0 18px;
  text-align: center;
}
@media (max-width: 480px) {.tuvi-ntx-wrap .ntx-page-head-compact { padding: 15px 16px; }.tuvi-ntx-wrap .ntx-page-title-compact { font-size: 19px; }
}

/* ── Tối ưu mobile riêng cho toàn bộ mảng nền Đỏ Đô vừa đồng bộ (header
   trang, thanh tiêu đề khối, header khối "Chọn Ngày Tốt", chip chọn) —
   thu nhỏ padding/khoảng cách để không chiếm quá nhiều màn hình hẹp,
   chữ vẫn đủ lớn để chạm (touch target) chính xác. ── */
@media (max-width: 480px) {
  .tuvi-ntx-wrap .ntx-page-head-compact { gap: 8px; }
  .tuvi-ntx-wrap .ntx-page-kicker-inline { font-size: 11.5px; letter-spacing: .16em; }
  .tuvi-ntx-wrap .ntx-block-title { margin: 0 -16px 12px; padding: 10px 16px; font-size: 14.5px; }
  .tuvi-ntx-wrap .ntx-block { padding: 0 16px 14px; }
  .tuvi-ntx-wrap .ntx-cal-head { margin: 0 -16px 12px; padding: 11px 14px; }
  .tuvi-ntx-wrap .ntx-tool-card { padding: 0 16px 20px; }
  .tuvi-ntx-wrap .ntx-tool-head { margin: 0 -16px 16px; padding: 16px 16px 14px; }
  .tuvi-ntx-wrap .ntx-tool-head::after { left: 16px; right: 16px; }
  .tuvi-ntx-wrap .ntx-tool-head .tuvi-ntx-title { font-size: 20px; }
  .tuvi-ntx-wrap .ntx-viec-chip { padding: 7px 12px; font-size: 13px; }
  .tuvi-ntx-wrap .ntx-month-chip { padding: 7px 10px; min-width: 52px; font-size: 13px; }
  .tuvi-ntx-wrap .ntx-viec-chips, .tuvi-ntx-wrap .ntx-month-chips { gap: 6px; }
  .tuvi-ntx-wrap .ntx-viec-group { margin-top: 10px; }
}.tuvi-ntx-wrap .tuvi-ntx-form-row { display: flex; gap: 16px; margin-bottom: 16px; flex-wrap: wrap; }.tuvi-ntx-wrap .tuvi-ntx-field { flex: 1 1 200px; margin-bottom: 16px; }.tuvi-ntx-wrap .tuvi-ntx-field label { display: block; font-size: 13px; color: var(--ntx-text-muted); margin-bottom: 8px; }.tuvi-ntx-wrap .tuvi-ntx-label-hint { font-size: 11.5px; color: var(--ntx-text-muted); opacity: .75; font-weight: 400; }.tuvi-ntx-wrap .tuvi-ntx-field input, .tuvi-ntx-wrap .tuvi-ntx-field select, .tuvi-ntx-wrap .tuvi-ntx-field textarea {
  width: 100%;
  box-sizing: border-box;
  border: 1px solid var(--ntx-border);
  border-radius: var(--ntx-radius);
  background: var(--ntx-bg);
  color: var(--ntx-text);
  padding: 8px 12px;
  font-family: var(--ntx-font);
  font-size: 14px;
  transition: border-color .15s ease, box-shadow .15s ease;
}
/* Mũi tên mặc định của trình duyệt (đen, chẻ đôi) phá vỡ tông Vàng Kim của
   thiết kế — tắt appearance gốc, thay bằng mũi tên SVG Vàng Kim tự vẽ. */
.tuvi-ntx-wrap .tuvi-ntx-field select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  padding-right: 34px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6' fill='none'%3E%3Cpath d='M1 1L5 5L9 1' stroke='%238A6D1F' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
}
/* Kéo giãn textarea sẽ xô lệch nút "Tìm Ngày Tốt" nằm ngay bên dưới —
   khoá cố định chiều cao, không cho resize tự do. */
.tuvi-ntx-wrap .tuvi-ntx-field textarea {
  resize: none;
  height: 76px;
  min-height: 76px;
  max-height: 76px;
}.tuvi-ntx-wrap .tuvi-ntx-field input:focus, .tuvi-ntx-wrap .tuvi-ntx-field select:focus, .tuvi-ntx-wrap .tuvi-ntx-field textarea:focus {
  outline: none;
  border: 2px solid var(--ntx-primary);
  padding: 7px 11px; /* trừ đi 1px tăng thêm của border để nội dung không nhảy vị trí */
  box-shadow: 0 0 0 3px rgba(212,175,55,.08);
}.tuvi-ntx-wrap .tuvi-ntx-btn {
  width: 100%;
  background: linear-gradient(155deg, var(--ntx-maroon-bg) 0%, var(--ntx-maroon-bg-dark) 100%);
  color: var(--ntx-maroon-text);
  border: 1.5px solid var(--ntx-gold);
  border-radius: var(--ntx-radius);
  padding: 12px 16px;
  font-family: var(--ntx-font);
  font-weight: 700;
  font-size: 15px;
  cursor: pointer;
  box-shadow: var(--ntx-shadow-maroon-btn);
  transition: all .18s cubic-bezier(.4,0,.2,1);

/* ── Thẻ bấm nhanh "Xem cho việc" (tap chips) — MẶC ĐỊNH nền Đỏ Đô/chữ
   Vàng Kim (đúng cặp token --ntx-maroon-*, đồng bộ toàn giao diện);
   khi CHỌN (active) đảo màu sang Vàng Kim đặc/chữ Đỏ Đô để nổi bật rõ
   ràng đâu là lựa chọn hiện tại, không lẫn với các chip chưa chọn. ── */
}.tuvi-ntx-wrap .ntx-viec-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 8px; }
/* D1: TRẠNG THÁI MẶC ĐỊNH (chưa chọn) — nền sáng/trong suốt + viền mỏng
   Đỏ Đô (outline style). Trước đây mặc định đã là nền đặc Đỏ Đô, khiến
   không đủ tương phản khi thật sự được chọn → ảnh hưởng trực tiếp tỷ lệ
   hoàn tất form. */.tuvi-ntx-wrap .ntx-viec-chip {
  border: 1.5px solid var(--ntx-border-strong, rgba(82,20,20,.35));
  background: var(--ntx-bg);
  color: var(--ntx-primary);
  border-radius: 999px;
  padding: 8px 15px;
  font-family: var(--ntx-font);
  font-size: 13.5px;
  font-weight: 600;
  cursor: pointer;
  box-shadow: none;
  transition: all .15s ease;
}.tuvi-ntx-wrap .ntx-viec-chip:hover { border-color: var(--ntx-primary); background: rgba(82,20,20,.06); }
/* D1: TRẠNG THÁI ĐÃ CHỌN — nền đặc Đỏ Đô + chữ Vàng Kim (đủ tương phản
   với mặc định), thêm dấu ✓ trước nhãn để không chỉ dựa vào màu sắc. */.tuvi-ntx-wrap .ntx-viec-chip.active {
  background: linear-gradient(155deg, var(--ntx-maroon-bg) 0%, var(--ntx-maroon-bg-dark) 100%);
  border-color: var(--ntx-primary);
  color: var(--ntx-maroon-text);
  box-shadow: var(--ntx-shadow-maroon-btn);
}.tuvi-ntx-wrap .ntx-viec-chip.active::before { content: "✓ "; font-weight: 800; }
/* ── Nhóm việc trong danh sách đầy đủ (đã bung hết ra thành chip, không
   còn ẩn trong <select>) — nhãn nhóm nhỏ, Vàng Đồng, phân tách các cụm
   chip theo từng chủ đề (Hôn nhân / Nhà cửa / Công việc...). ── */
.tuvi-ntx-wrap .ntx-viec-group { margin-top: 12px; }.tuvi-ntx-wrap .ntx-viec-group:first-of-type { margin-top: 12px; }.tuvi-ntx-wrap .ntx-viec-group-label {
  display: block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--ntx-gold-ink);
  margin-bottom: 6px;
}
/* ── Chọn tháng: dải chip tháng thực tế (hiện tại → hết năm) ── */
.tuvi-ntx-wrap .ntx-month-chips { display: flex; flex-wrap: wrap; gap: 8px; }
/* D1: cùng logic mặc định/đã chọn như ntx-viec-chip ở trên, đồng bộ 2 nhóm chip. */.tuvi-ntx-wrap .ntx-month-chip {
  border: 1.5px solid var(--ntx-border-strong, rgba(82,20,20,.35));
  background: var(--ntx-bg);
  color: var(--ntx-primary);
  border-radius: var(--ntx-radius-sm);
  padding: 8px 14px;
  min-width: 60px;
  text-align: center;
  font-family: var(--ntx-font);
  font-size: 13.5px;
  font-weight: 600;
  cursor: pointer;
  box-shadow: none;
  transition: all .15s ease;
}.tuvi-ntx-wrap .ntx-month-chip .yr { display: block; font-size: 10.5px; font-weight: 400; color: var(--ntx-primary); opacity: .65; margin-top: 1px; }.tuvi-ntx-wrap .ntx-month-chip:hover { border-color: var(--ntx-primary); background: rgba(82,20,20,.06); }.tuvi-ntx-wrap .ntx-month-chip.active {
  background: linear-gradient(155deg, var(--ntx-maroon-bg) 0%, var(--ntx-maroon-bg-dark) 100%);
  border-color: var(--ntx-primary);
  color: var(--ntx-maroon-text);
  box-shadow: var(--ntx-shadow-maroon-btn);
}.tuvi-ntx-wrap .ntx-month-chip.active::before { content: "✓ "; font-weight: 800; }.tuvi-ntx-wrap .ntx-month-chip.active .yr { color: var(--ntx-maroon-text); opacity: .75; }.tuvi-ntx-wrap .ntx-hint {
  font-size: 11.5px;
  color: var(--ntx-text-muted);
  margin-top: 8px;
}

/* ── Tuỳ chọn nâng cao (accordion): gom Năm sinh + Câu hỏi cá nhân hoá,
   đóng mặc định — giảm số field hiện ngay từ đầu. ── */
.tuvi-ntx-wrap .ntx-accordion {
  margin-top: 16px;
  border-top: 1px dashed var(--ntx-border);
  padding-top: 4px;
}.tuvi-ntx-wrap .ntx-accordion summary {
  cursor: pointer;
  list-style: none;
  font-size: 13.5px;
  font-weight: 600;
  color: var(--ntx-gold-ink);
  padding: 10px 0;
  display: flex;
  align-items: center;
  gap: 6px;
  font-family: var(--ntx-font);
}.tuvi-ntx-wrap .ntx-accordion summary::-webkit-details-marker { display: none; }.tuvi-ntx-wrap .ntx-accordion summary:before {
  content: "▸";
  display: inline-block;
  transition: transform .15s ease;
}.tuvi-ntx-wrap .ntx-accordion[open] summary:before { transform: rotate(90deg); }.tuvi-ntx-wrap .ntx-accordion .tuvi-ntx-field:first-of-type { margin-top: 4px; }.tuvi-ntx-wrap .ntx-canchi-hint {
  display: block;
  margin-top: 6px;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--ntx-primary);
  min-height: 16px;
}.tuvi-ntx-wrap .tuvi-ntx-btn:hover { filter: brightness(1.1); transform: translateY(-1px); box-shadow: var(--ntx-shadow-maroon-btn-hover); }.tuvi-ntx-wrap .tuvi-ntx-btn:active { transform: translateY(1px); box-shadow: var(--ntx-shadow-maroon-btn-active); }.tuvi-ntx-wrap .tuvi-ntx-btn:disabled { opacity: .6; cursor: not-allowed; transform: none; box-shadow: none; }.tuvi-ntx-wrap .tuvi-ntx-loading { text-align: center; padding: 16px; color: var(--ntx-text-muted); }.tuvi-ntx-wrap .tuvi-ntx-error {
  background: var(--ntx-error-bg);
  border: 1px solid var(--ntx-error);
  color: var(--ntx-error);
  border-radius: var(--ntx-radius);
  padding: 12px 16px;
  margin-top: 16px;
  font-size: 13px;
}.tuvi-ntx-wrap .tuvi-ntx-result { margin-top: 16px; border-top: 1px solid var(--ntx-border); padding-top: 16px; }.tuvi-ntx-wrap .tuvi-ntx-result .ntx-header {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 8px; flex-wrap: wrap; gap: 8px;
}.tuvi-ntx-wrap .tuvi-ntx-result .ntx-am-duong { font-size: 13px; color: var(--ntx-text-muted); }.tuvi-ntx-wrap .ntx-badge {
  display: inline-block;
  padding: 4px 12px;
  border-radius: 999px;
  font-weight: 600;
  font-size: 13px;
}.tuvi-ntx-wrap .ntx-badge.tot { background: var(--ntx-good-bg); color: var(--ntx-good); }.tuvi-ntx-wrap .ntx-badge.xau { background: var(--ntx-bad-bg); color: var(--ntx-bad); }.tuvi-ntx-wrap .ntx-badge.binh_thuong { background: var(--ntx-neutral2-bg); color: var(--ntx-neutral2); }.tuvi-ntx-wrap .ntx-badge.chua_du_du_lieu { background: var(--ntx-nodata-bg); color: var(--ntx-nodata); }.tuvi-ntx-wrap .ntx-facts { list-style: none; margin: 8px 0; padding: 0; font-size: 13px; }.tuvi-ntx-wrap .ntx-facts li { padding: 4px 0; border-bottom: 1px solid var(--ntx-border); display: flex; justify-content: space-between; gap: 10px; }.tuvi-ntx-wrap .ntx-facts li:last-child { border-bottom: none; }.tuvi-ntx-wrap .ntx-facts li span:first-child { flex: 0 0 auto; color: var(--ntx-text-muted); }.tuvi-ntx-wrap .ntx-facts li span:last-child { flex: 1 1 auto; text-align: right; font-weight: 600; color: var(--ntx-text); }

@media (max-width: 480px) {.tuvi-ntx-wrap .tuvi-ntx-form-row { flex-direction: column; gap: 0; }
  /* .tuvi-ntx-field dùng flex: 1 1 200px để chia cột đều trên desktop.
     Khi form-row chuyển sang flex-direction: column ở mobile, con số 200px
     đó bị hiểu thành CHIỀU CAO tối thiểu (flex-basis theo trục chính dọc)
     → mỗi field bị ép cao tối thiểu 200px dù nội dung chỉ ~70-80px, tạo
     khoảng trắng rất lớn giữa các trường. Ép lại flex-basis: auto để field
     cao đúng theo nội dung thật của nó. */.tuvi-ntx-wrap .tuvi-ntx-field { flex: 1 1 auto; margin-bottom: 16px; }.tuvi-ntx-wrap .tuvi-ntx-field:last-child { margin-bottom: 0; }
}

/* ═══════════════════════════════════════════════════
   TRANG CHI TIẾT NGÀY — DASHBOARD (view="detail")
   Mobile-first, dùng lại nguyên token --ntx-* ở trên.
   ═══════════════════════════════════════════════════ */.tuvi-ntx-wrap { max-width: 720px; }.tuvi-ntx-wrap .tuvi-ntx-view[data-view="detail"] { max-width: 720px; width: 100%; margin: 0 auto; box-sizing: border-box; }.tuvi-ntx-wrap .ntx-back-btn {
  background: var(--ntx-bg);
  border: 1.5px solid var(--ntx-border);
  border-radius: var(--ntx-radius);
  color: var(--ntx-text-muted);
  font-family: var(--ntx-font);
  font-size: 13px;
  padding: 8px 16px;
  margin-bottom: 12px;
  cursor: pointer;
  box-shadow: 0 2px 6px rgba(15,23,42,.06);
  transition: all .18s cubic-bezier(.4,0,.2,1);
}.tuvi-ntx-wrap .ntx-back-btn:hover { border-color: var(--ntx-gold); color: var(--ntx-primary); transform: translateY(-1px); }

/* Nút "Xem chi tiết" mở dashboard từ Trang chủ — cùng cặp nền Đỏ Đô/chữ
   Vàng Kim với các nút bấm chọn khác trong toàn giao diện. */.tuvi-ntx-wrap .ntx-btn-detail {
  display: block;
  width: 100%;
  text-align: center;
  margin-top: 14px;
  background: linear-gradient(155deg, var(--ntx-maroon-bg) 0%, var(--ntx-maroon-bg-dark) 100%);
  border: 1.5px solid rgba(233,196,104,.4);
  color: var(--ntx-maroon-text);
  border-radius: var(--ntx-radius);
  padding: 13px 16px; /* ~48px chiều cao tổng — đạt chuẩn touch target tối thiểu */
  font-family: var(--ntx-font);
  font-weight: 600;
  font-size: 14px;
  cursor: pointer;
  box-shadow: var(--ntx-shadow-maroon-btn);
  transition: all .18s cubic-bezier(.4,0,.2,1);
}.tuvi-ntx-wrap .ntx-btn-detail:hover { border-color: var(--ntx-gold); filter: brightness(1.15); transform: translateY(-1px); box-shadow: var(--ntx-shadow-maroon-btn-hover); }.tuvi-ntx-wrap .ntx-btn-detail:active { transform: translateY(1px); box-shadow: var(--ntx-shadow-maroon-btn-active); }

/* Card dùng chung cho từng khối trong dashboard */.tuvi-ntx-wrap .ntx-block {
  background: var(--ntx-bg);
  border: 1px solid var(--ntx-border);
  border-radius: var(--ntx-radius);
  box-shadow: 0 2px 18px rgba(15,23,42,.06);
  padding: 0 20px 16px;
  margin-bottom: 16px;
  overflow: hidden;
}
/* Thu gọn riêng thẻ "Chi tiết ngày đã chọn" trong thanh bên — không ảnh
   hưởng layout trang Dashboard chi tiết đầy đủ (view="detail"), để vừa
   khít trong đúng chiều cao khối lịch tháng mà vẫn hiện đủ thông tin. */.tuvi-ntx-wrap .ntx-quick-block.ntx-block { padding: 0 16px 14px; }.tuvi-ntx-wrap .ntx-quick-block .ntx-block-title { margin: 0 -16px 10px; padding: 10px 16px; font-size: 13.5px; }.tuvi-ntx-wrap .ntx-quick-block .ntx-quick-cta { margin: 14px 0 2px; width: 100%; }
/* B1: accordion "Xem chi tiết lịch pháp" trong panel chi tiết ngày —
   dùng lại .ntx-accordion có sẵn, chỉ chỉnh khoảng cách cho vừa panel
   hẹp của thanh bên và bỏ margin-top mặc định của .ntx-facts bên trong. */
.tuvi-ntx-wrap .ntx-quick-lawcal-accordion { margin: 10px 0 4px; }
.tuvi-ntx-wrap .ntx-quick-lawcal-accordion .ntx-facts { margin-top: 8px; }
/* Thanh tiêu đề khối — khung nền Đỏ Đô/chữ Vàng Kim, đúng cặp token
   --ntx-maroon-* dùng chung toàn giao diện, "bo" ngay phía trên nội
   dung đọc của từng khối để phân tách rõ ràng các mục trong dashboard. */.tuvi-ntx-wrap .ntx-block-title {
  font-family: var(--ntx-font-title);
  font-weight: 700;
  font-size: 16px;
  color: var(--ntx-maroon-text);
  background: linear-gradient(155deg, var(--ntx-maroon-bg) 0%, var(--ntx-maroon-bg-dark) 100%);
  margin: 0 -20px 14px;
  padding: 12px 20px;
  display: flex;
  align-items: center;
  gap: 8px;
}

/* Hero: ngày + âm lịch + can chi */.tuvi-ntx-wrap .ntx-hero {
  text-align: center;
  padding: 24px 20px;
  border-radius: var(--ntx-radius);
  background: linear-gradient(180deg, var(--ntx-bg-hover) 0%, var(--ntx-bg) 100%);
  border: 1px solid var(--ntx-border);
  margin-bottom: 16px;
}.tuvi-ntx-wrap .ntx-hero .ntx-hero-date {
  font-family: var(--ntx-font-title);
  font-weight: 600;
  font-size: 24px;
  color: var(--ntx-primary);
}.tuvi-ntx-wrap .ntx-hero .ntx-hero-sub { font-size: 13px; color: var(--ntx-text-muted); margin-top: 4px; }.tuvi-ntx-wrap .ntx-hero .ntx-hero-canchi { margin-top: 8px; font-size: 14px; font-weight: 600; color: var(--ntx-text-muted); }

/* Gauge điểm tổng quan (semicircle SVG) */.tuvi-ntx-wrap .ntx-gauge-wrap { display: flex; flex-direction: column; align-items: center; gap: 8px; }.tuvi-ntx-wrap .ntx-gauge-wrap svg { display: block; }.tuvi-ntx-wrap .ntx-gauge-score { font-family: var(--ntx-font-title); font-variant-numeric: tabular-nums; font-weight: 700; font-size: 26px; fill: var(--ntx-primary); }.tuvi-ntx-wrap .ntx-gauge-label { font-size: 12px; fill: var(--ntx-text-muted); }

/* Progress từng hạng mục (điểm tốt / điểm xấu) */.tuvi-ntx-wrap .ntx-progress-row { margin-bottom: 12px; }.tuvi-ntx-wrap .ntx-progress-row:last-child { margin-bottom: 0; }.tuvi-ntx-wrap .ntx-progress-head { display: flex; justify-content: space-between; font-size: 13px; margin-bottom: 4px; }.tuvi-ntx-wrap .ntx-progress-track { height: 8px; border-radius: 999px; background: rgba(212,175,55,.15); overflow: hidden; }.tuvi-ntx-wrap .ntx-progress-fill { height: 100%; border-radius: 999px; transition: width .5s ease; }.tuvi-ntx-wrap .ntx-progress-fill.tot { background: var(--ntx-success); }.tuvi-ntx-wrap .ntx-progress-fill.xau { background: var(--ntx-error); }

/* Timeline 12 giờ trong ngày (Tý..Hợi), đánh dấu giờ Hoàng Đạo */.tuvi-ntx-wrap .ntx-timeline { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; }
@media (max-width: 480px) {.tuvi-ntx-wrap .ntx-timeline { grid-template-columns: repeat(4, 1fr); } }.tuvi-ntx-wrap .ntx-timeline-item {
  text-align: center;
  border: 1px solid var(--ntx-border);
  border-radius: var(--ntx-radius);
  padding: 8px 4px;
  font-size: 12px;
  color: var(--ntx-text-muted);
  background: var(--ntx-bg);
}.tuvi-ntx-wrap .ntx-timeline-item.hoang-dao {
  border-color: var(--ntx-good-border);
  background: var(--ntx-good-bg);
  color: var(--ntx-good);
  font-weight: 600;
}.tuvi-ntx-wrap .ntx-timeline-item .ntx-tl-chi { display: block; font-family: var(--ntx-font-title); font-size: 14px; }.tuvi-ntx-wrap .ntx-timeline-item .ntx-tl-gio { display: block; font-size: 10px; opacity: .8; }

/* B3: dải giờ Hoàng Đạo compact (thanh ngang) cho panel chi tiết nhanh — bản thu gọn của .ntx-timeline, dùng trong sidebar hẹp */
.tuvi-ntx-wrap .ntx-hour-strip-wrap { display: block; margin-top: 12px; }
.tuvi-ntx-wrap .ntx-hour-strip { display: flex; gap: 3px; margin-top: 6px; }
.tuvi-ntx-wrap .ntx-hour-strip-item {
  flex: 1 1 0;
  text-align: center;
  font-size: 10px;
  line-height: 22px;
  border-radius: 4px;
  color: var(--ntx-text-muted);
  background: var(--ntx-bg);
  border: 1px solid var(--ntx-border);
  opacity: .55;
  cursor: default;
}.tuvi-ntx-wrap .ntx-hour-strip-item.hoang-dao {
  color: var(--ntx-good);
  background: var(--ntx-good-bg);
  border-color: var(--ntx-good-border);
  font-weight: 700;
  opacity: 1;
}
@media (max-width: 480px) {.tuvi-ntx-wrap .ntx-hour-strip { flex-wrap: wrap; }.tuvi-ntx-wrap .ntx-hour-strip-item { flex: 1 1 14%; } }

/* Việc phù hợp / nên tránh — khối "nổi khối", viền vàng đồng bộ tone chủ đạo */.tuvi-ntx-wrap .ntx-viec-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; }
@media (max-width: 480px) {.tuvi-ntx-wrap .ntx-viec-grid { grid-template-columns: 1fr; } }.tuvi-ntx-wrap .ntx-viec-col {
  border-radius: var(--ntx-radius);
  padding: 16px 20px;
  border: 1.5px solid var(--ntx-gold);
  box-shadow: 0 3px 0 rgba(82,20,20,.10), 0 4px 14px rgba(82,20,20,.08);
  position: relative;
}.tuvi-ntx-wrap .ntx-viec-col.nen-lam { background: var(--ntx-good-bg); border-color: var(--ntx-good-border); }.tuvi-ntx-wrap .ntx-viec-col.nen-tranh { background: var(--ntx-bad-bg); border-color: var(--ntx-bad-border); }.tuvi-ntx-wrap .ntx-viec-col h4 {
  margin: 0 0 8px;
  font-size: 15px;
  font-weight: 700;
  display: flex; align-items: center; gap: 8px;
  padding-bottom: 8px;
  border-bottom: 1px dashed var(--ntx-border);
}.tuvi-ntx-wrap .ntx-viec-col.nen-lam h4 { color: var(--ntx-good); }.tuvi-ntx-wrap .ntx-viec-col.nen-tranh h4 { color: var(--ntx-bad); }.tuvi-ntx-wrap .ntx-viec-col ul { margin: 0; padding-left: 20px; font-size: 14px; line-height: 1.8; }.tuvi-ntx-wrap .ntx-viec-col li::marker { color: var(--ntx-gold); }
/* C2: icon ✓/✕ redundant cho "Nên làm"/"Nên tránh" — tận dụng đúng
   ngôn ngữ màu xanh/đỏ (--ntx-good/--ntx-bad) đã dùng ở nơi khác trong
   hệ thống, thay marker chấm tròn mặc định bằng icon có ý nghĩa. */
.tuvi-ntx-wrap .ntx-viec-col.nen-lam ul, .tuvi-ntx-wrap .ntx-viec-col.nen-tranh ul { list-style: none; padding-left: 0; }
.tuvi-ntx-wrap .ntx-viec-col.nen-lam li, .tuvi-ntx-wrap .ntx-viec-col.nen-tranh li { display: flex; align-items: flex-start; gap: 8px; }
.tuvi-ntx-wrap .ntx-viec-col.nen-lam li::before { content: "✓"; flex: 0 0 auto; color: var(--ntx-good); font-weight: 700; line-height: 1.8; }
.tuvi-ntx-wrap .ntx-viec-col.nen-tranh li::before { content: "✕"; flex: 0 0 auto; color: var(--ntx-bad); font-weight: 700; line-height: 1.8; }
.tuvi-ntx-wrap .ntx-viec-col .ntx-viec-empty::before { content: ""; }
.tuvi-ntx-wrap .ntx-viec-col .ntx-viec-empty {
  list-style: none;
  margin-left: -20px;
  font-size: 12.5px;
  color: var(--ntx-text-muted);
  font-style: italic;
  line-height: 1.6;
}

/* Bảng phân tích chi tiết (Can Chi, Trực, Nhị Thập Bát Tú, Hướng...) */.tuvi-ntx-wrap .ntx-info-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 6px 20px; }
@media (max-width: 480px) {.tuvi-ntx-wrap .ntx-info-grid { grid-template-columns: 1fr; } }.tuvi-ntx-wrap .ntx-info-item { display: flex; justify-content: space-between; border-bottom: 1px dashed var(--ntx-border); padding: 6px 0; font-size: 13px; }.tuvi-ntx-wrap .ntx-info-item span:first-child { color: var(--ntx-text-muted); }.tuvi-ntx-wrap .ntx-info-item span:last-child { font-weight: 600; text-align: right; }

/* Kết luận */.tuvi-ntx-wrap .ntx-conclusion { font-size: 14px; line-height: 1.7; }.tuvi-ntx-wrap .ntx-conclusion p,
.tuvi-ntx-wrap .ntx-narrative-body p { margin: 0 0 10px; }.tuvi-ntx-wrap .ntx-conclusion p:last-child,
.tuvi-ntx-wrap .ntx-narrative-body p:last-child { margin-bottom: 0; }

/* Tiêu đề mục trong văn bản luận giải (VD "Nên làm:", "Lưu ý:") — tách hẳn
   khỏi đoạn văn thành 1 dòng riêng, CỠ CHỮ LỚN HƠN nội dung + đậm hơn hẳn
   để phân cấp rõ ràng, không còn bị chìm dưới đoạn văn thường (trước đây
   cùng cỡ 14px với serif nhẹ nên nhìn nhỏ/mờ hơn văn bản in đậm bên dưới). */.tuvi-ntx-wrap .ntx-narrative-heading {
  font-family: var(--ntx-font);
  font-size: 16px;
  font-weight: 800;
  color: var(--ntx-primary);
  margin: 16px 0 8px;
  line-height: 1.3;
}.tuvi-ntx-wrap .ntx-narrative-heading:first-child { margin-top: 0; }

/* Đường kẻ phân cách — thay cho chuỗi "---" hiện nguyên văn trước đây */.tuvi-ntx-wrap .ntx-narrative-hr {
  height: 1px;
  border: none;
  margin: 16px 0;
  background: linear-gradient(90deg, transparent 0%, var(--ntx-gold) 50%, transparent 100%);
}

/* Danh sách "Nên làm / Nên tránh" bên trong văn bản luận giải — <ul><li>
   thật, không còn ký tự "•" gõ tay dính sát chữ. */.tuvi-ntx-wrap .ntx-narrative-list {
  margin: 0 0 10px;
  padding-left: 20px;
}.tuvi-ntx-wrap .ntx-narrative-list li { margin-bottom: 6px; line-height: 1.55; }.tuvi-ntx-wrap .ntx-narrative-list li:last-child { margin-bottom: 0; }.tuvi-ntx-wrap .ntx-narrative-list li::marker { color: var(--ntx-gold-ink); }





/* ═══════════════════════════════════════════════════
   LỊCH THÁNG (Trang chủ)
   ═══════════════════════════════════════════════════ */.tuvi-ntx-wrap .ntx-cal-block { padding: 0 16px 16px; overflow: hidden; border-radius: var(--ntx-radius); }.tuvi-ntx-wrap .ntx-cal-head {
  display: flex; align-items: center; justify-content: space-between;
  gap: 8px;
  margin: 0 -16px 14px;
  padding: 13px 16px;
  background: linear-gradient(155deg, var(--ntx-maroon-bg) 0%, var(--ntx-maroon-bg-dark) 100%);
}.tuvi-ntx-wrap .ntx-cal-head-center {
  display: flex; flex-direction: column; align-items: center; gap: 4px;
  flex: 1;
  min-width: 0;
}.tuvi-ntx-wrap .ntx-cal-title {
  font-family: var(--ntx-font-title);
  font-weight: 700;
  font-size: 18px;
  color: #FBEFD4;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}.tuvi-ntx-wrap .ntx-cal-today {
  border: 1px solid rgba(233,196,104,.35);
  background: rgba(233,196,104,.10);
  color: var(--ntx-maroon-text);
  font-size: 11px;
  font-weight: 600;
  cursor: pointer;
  padding: 4px 8px;
  border-radius: 999px;
  transition: background .15s ease-out, color .15s ease-out, border-color .15s ease-out;
}.tuvi-ntx-wrap .ntx-cal-today:hover { background: rgba(233,196,104,.22); color: #FBEFD4; border-color: rgba(233,196,104,.55); }.tuvi-ntx-wrap .ntx-cal-nav {
  flex-shrink: 0;
  width: 34px; height: 34px;
  border: 1px solid rgba(233,196,104,.35);
  border-radius: 999px;
  background: rgba(233,196,104,.10);
  color: var(--ntx-maroon-text);
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
  transition: background .15s ease-out, border-color .15s ease-out, transform .15s ease-out;
}.tuvi-ntx-wrap .ntx-cal-nav:hover { background: var(--ntx-gold); color: var(--ntx-primary); border-color: var(--ntx-gold); transform: translateY(-1px); }.tuvi-ntx-wrap .ntx-cal-nav:active { transform: translateY(0); }.tuvi-ntx-wrap .ntx-cal-nav:disabled { opacity: .4; cursor: default; transform: none; box-shadow: none; }.tuvi-ntx-wrap .ntx-cal-nav:focus-visible, .tuvi-ntx-wrap .ntx-cal-today:focus-visible { outline: 2px solid var(--ntx-gold); outline-offset: 2px; }.tuvi-ntx-wrap .ntx-cal-weekdays {
  display: grid; grid-template-columns: repeat(7, minmax(0, 1fr));
  font-size: 12px; font-weight: 600; color: var(--ntx-text-muted); text-align: center;
  padding-bottom: 8px;
  margin-bottom: 8px;
  border-bottom: 1px solid var(--ntx-border);
}.tuvi-ntx-wrap .ntx-cal-grid {
  display: grid; grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 0;
  margin-top: 6px;
  border-top: 1px solid var(--ntx-border);
  border-left: 1px solid var(--ntx-border);
  border-radius: 10px;
  overflow: hidden;
  background: var(--ntx-bg);
}.tuvi-ntx-wrap .ntx-cal-day {
  position: relative;
  min-height: 96px;
  min-width: 0;
  border-radius: 0;
  border-right: 1px solid var(--ntx-border);
  border-bottom: 1px solid var(--ntx-border);
  background: var(--ntx-bg);
  display: flex; flex-direction: column; align-items: center; justify-content: flex-start;
  text-align: center;
  padding: 8px 6px 6px;
  cursor: pointer;
  color: var(--ntx-text);
  transition: box-shadow .18s cubic-bezier(.4,0,.2,1), background-color .18s cubic-bezier(.4,0,.2,1);
}
/* Hover trong bảng liền mạch: không scale (tránh lệch lưới), chỉ đổi nền + nổi lớp trên các ô cạnh */.tuvi-ntx-wrap .ntx-cal-day:hover { background: var(--ntx-bg-hover); box-shadow: inset 0 0 0 1px var(--ntx-border-strong, var(--ntx-primary)); z-index: 2; }.tuvi-ntx-wrap .ntx-cal-day:focus-visible { outline: 2px solid var(--ntx-primary); outline-offset: -2px; z-index: 3; }.tuvi-ntx-wrap .ntx-cal-day.empty { cursor: default; background: var(--ntx-bg-page); }

/* Trạng thái nhìn thấy NGAY, không cần dò legend — viền màu theo đúng
   quy ước phổ thông (xanh=tốt / vàng=bình thường / đỏ=xấu / xám=chưa rõ),
   dùng CHUNG 1 hệ token với badge/panel — không còn lệch pha màu.
   A1: nền màu nhạt theo xep_loai là TÍN HIỆU CHÍNH (đủ tương phản để liếc
   thấy trong 1-2 giây); viền màu + chấm/sao giữ lại làm tín hiệu phụ
   (redundant encoding), không xoá. */.tuvi-ntx-wrap .ntx-cal-day.tot { background: var(--ntx-good-bg); box-shadow: inset 0 0 0 1px var(--ntx-good-border); }.tuvi-ntx-wrap .ntx-cal-day.binh_thuong { background: var(--ntx-neutral2-bg); box-shadow: inset 0 0 0 1px var(--ntx-neutral2-border); }.tuvi-ntx-wrap .ntx-cal-day.xau { background: var(--ntx-bad-bg); box-shadow: inset 0 0 0 1px var(--ntx-bad-border); }.tuvi-ntx-wrap .ntx-cal-day.chua_du_du_lieu { background: var(--ntx-bg); box-shadow: inset 0 0 0 1px var(--ntx-nodata-border); }

/* Ngày dương — điểm tựa thị giác chính, đọc trước tiên (Hierarchy đúng thứ tự).
   Bản sửa mới: nhãn trạng thái đã chuyển XUỐNG ĐÁY ô (thay thế đúng vị trí
   thanh năng lượng/chấm điểm cũ), giải phóng phần trên của ô — số ngày vì
   vậy được tăng cỡ chữ thêm (20px → 23px) để làm trọng tâm rõ hơn. */.tuvi-ntx-wrap .ntx-cal-info { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; min-width: 0; }.tuvi-ntx-wrap .ntx-cal-day .ntx-cal-dd { flex: 0 0 auto; font-family: var(--ntx-font); font-variant-numeric: tabular-nums; font-size: 21px; font-weight: 800; line-height: 1; color: var(--ntx-text); }.tuvi-ntx-wrap .ntx-cal-day .ntx-cal-am { font-size: 10.5px; font-weight: 500; color: var(--ntx-text-muted); margin-top: 3px; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }.tuvi-ntx-wrap .ntx-cal-day .ntx-cal-am b { font-weight: 700; font-style: normal; }

/* Đã bỏ "thanh trạng thái" (chấm điểm .ntx-meter-seg/.ntx-cal-stars) khỏi
   ô lịch — nhãn trạng thái đáy ô (.ntx-cal-status bên dưới) đã gánh việc
   truyền đạt Hoàng Đạo/Bình Thường/Hắc Đạo/Chưa có dữ liệu rồi, tránh
   trùng lặp tín hiệu. .ntx-meter-seg vẫn giữ nguyên CSS vì còn dùng ở nơi
   khác (ntx-energy-stars, khối "Luận giải nhanh"). */

/* A2: Badge "ngày đẹp nhất tháng" — viền vàng gold nổi bật hơn viền
   thường, tách biệt hoàn toàn khỏi màu "hôm nay" (xem A3). Backend/JS chỉ
   gắn cho TỐI ĐA 3 ngày điểm cao nhất mỗi tháng (không phải cứ đủ ngưỡng
   sao là gắn) — nổi bật chỉ có giá trị khi hiếm. */.tuvi-ntx-wrap .ntx-cal-day.is-top { box-shadow: inset 0 0 0 1.5px var(--ntx-gold); }

/* Nhãn trạng thái — đặt Ở ĐÁY ô, đúng vị trí thanh năng lượng (chấm điểm)
   trước đây, nằm TRONG LUỒNG bố cục bình thường (không absolute) nên
   không bao giờ đè lên số ngày/âm lịch phía trên, và ô tự giãn cao hơn
   khi nhãn cần xuống dòng (không dùng ellipsis — không bao giờ mất chữ).
   Chỉ dùng CHỮ — đã bỏ icon ✓/–/⚠/○ vì chữ "Đẹp Nhất/Trung Bình/Xấu/
   Chưa rõ" tự thân đã đủ rõ nghĩa, icon chỉ là trùng lặp không cần thiết.
   Màu đồng bộ đúng 1 cặp nền/viền/chữ với xep_loai của ngày (cùng token
   với .ntx-badge, .ntx-legend-chip). */.tuvi-ntx-wrap .ntx-cal-status {
  align-self: center;
  display: inline-block;
  max-width: 100%;
  margin-top: 8px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .01em;
  line-height: 1.4;
  padding: 2px 8px;
  border-radius: 999px;
  border: 1px solid transparent;
  box-shadow: 0 1px 2px rgba(15,23,42,.08);
  white-space: normal;
}.tuvi-ntx-wrap .ntx-cal-status--tot { background: var(--ntx-good-bg); border-color: var(--ntx-good-border); color: var(--ntx-good); }.tuvi-ntx-wrap .ntx-cal-status--binh_thuong { background: var(--ntx-neutral2-bg); border-color: var(--ntx-neutral2-border); color: var(--ntx-neutral2); }.tuvi-ntx-wrap .ntx-cal-status--xau { background: var(--ntx-bad-bg); border-color: var(--ntx-bad-border); color: var(--ntx-bad); }.tuvi-ntx-wrap .ntx-cal-status--chua_du_du_lieu { background: var(--ntx-nodata-bg); border-color: var(--ntx-nodata-border); color: var(--ntx-nodata); }

/* Nhãn "Hôm nay" — đặt gọn góc trên-phải, NẰM TRONG ô (không nổi ra
   ngoài viền như bản trước — đó là nguyên nhân bị cắt/vỡ trên mobile khi
   ô ở đầu bảng không đủ khoảng trống phía trên). Cỡ chữ nhỏ, không chiếm
   chỗ số ngày (đã căn giữa dọc trong info block bên dưới). */.tuvi-ntx-wrap .ntx-cal-today-tag {
  position: absolute;
  top: 4px;
  right: 4px;
  z-index: 2;
  max-width: calc(100% - 8px);
  font-size: 8.5px;
  font-weight: 800;
  letter-spacing: .01em;
  line-height: 1.3;
  padding: 1.5px 6px;
  border-radius: 999px;
  background: var(--ntx-gold);
  color: var(--ntx-primary);
  white-space: nowrap;
  text-align: center;
  box-shadow: 0 1px 2px rgba(15,23,42,.15);
}

/* A3 (bản sửa 2026-07-24, lần 2): bỏ nhãn text "Hôm nay" (tràn chữ trên
   mobile) — ĐÃ THỬ viền xanh + glow nhấp nháy nhưng bị đánh giá "phèn",
   không hợp thẩm mỹ chung của giao diện. Đổi hướng: dùng NỀN (không phải
   màu viền động) làm tín hiệu chính — 1 lớp phủ xanh lá rất nhạt, TĨNH
   (không animation), qua ::before để không che thông tin nền trạng thái
   ngày (tốt/bình thường/xấu) hay bất kỳ nội dung nào phía trên (ribbon,
   số ngày...). Viền chỉ còn là tín hiệu phụ, mảnh và nhẹ. */
.tuvi-ntx-wrap .ntx-cal-day.today {
  box-shadow: inset 0 0 0 2px var(--ntx-today-ring);
  z-index: 1;
}
.tuvi-ntx-wrap .ntx-cal-day.today::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(165deg, rgba(34,197,94,.16), rgba(34,197,94,.03) 70%);
  border-radius: inherit;
  pointer-events: none;
}
.tuvi-ntx-wrap .ntx-cal-top-row {
  display: flex; align-items: center; justify-content: center;
  width: 100%; gap: 8px;
}

/* Đang được chọn (Active) — không chỉ đổi viền: thêm shadow glow, viền đậm
   hơn, nền tint nhẹ theo đúng màu trạng thái của ngày, transition mượt. */.tuvi-ntx-wrap .ntx-cal-day.selected {
  border-width: 2px;
  border-color: var(--ntx-primary);
  background: rgba(212,175,55,.045);
  box-shadow: 0 0 0 3px rgba(212,175,55,.10), 0 6px 16px rgba(15,23,42,.10);
  position: relative;
  z-index: 3;
}.tuvi-ntx-wrap .ntx-cal-day.selected::before {
  content: '';
  position: absolute; top: -2px; left: 8px; right: 8px;
  height: 2px;
  background: var(--ntx-gold);
  border-radius: 2px 2px 0 0;
}.tuvi-ntx-wrap .ntx-cal-legend {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px;
  margin-top: 16px; padding-top: 16px;
  border-top: 1px solid var(--ntx-border);
}.tuvi-ntx-wrap .ntx-legend-chip {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 12px; font-weight: 600;
  padding: 4px 12px;
  border-radius: 999px;
  border: 1px solid transparent;
  background: var(--ntx-bg-hover);
  color: var(--ntx-text-muted);
}.tuvi-ntx-wrap .ntx-legend-chip.tot { background: var(--ntx-good-bg); border-color: var(--ntx-good-border); color: var(--ntx-good); }.tuvi-ntx-wrap .ntx-legend-chip.binh_thuong { background: var(--ntx-neutral2-bg); border-color: var(--ntx-neutral2-border); color: var(--ntx-neutral2); }.tuvi-ntx-wrap .ntx-legend-chip.xau { background: var(--ntx-bad-bg); border-color: var(--ntx-bad-border); color: var(--ntx-bad); }.tuvi-ntx-wrap .ntx-legend-chip.chua_du_du_lieu { background: var(--ntx-nodata-bg); border-color: var(--ntx-nodata-border); color: var(--ntx-nodata); }.tuvi-ntx-wrap .ntx-legend-chip .dot {
  display: inline-block; width: 7px; height: 7px; border-radius: 50%;
  flex-shrink: 0;
}.tuvi-ntx-wrap .ntx-legend-chip.tot .dot { background: var(--ntx-good); }.tuvi-ntx-wrap .ntx-legend-chip.xau .dot { background: var(--ntx-bad); }.tuvi-ntx-wrap .ntx-legend-chip.binh_thuong .dot { background: var(--ntx-neutral2); }.tuvi-ntx-wrap .ntx-legend-chip.chua_du_du_lieu .dot { background: var(--ntx-nodata); }

@media (max-width: 480px) {.tuvi-ntx-wrap .ntx-cal-title { font-size: 15px; }.tuvi-ntx-wrap .ntx-cal-nav { width: 32px; height: 32px; font-size: 14px; }.tuvi-ntx-wrap .ntx-cal-day { min-height: 76px; padding: 6px 2px 5px; }.tuvi-ntx-wrap .ntx-cal-day .ntx-cal-dd { font-size: 15px; }.tuvi-ntx-wrap .ntx-cal-day .ntx-cal-am { font-size: 7.5px; margin-top: 2px; }
  /* Nhãn trạng thái: ép KHÔNG xuống dòng trên mobile — thu nhỏ chữ/khoảng
     đệm/bo góc thay vì cho wrap (wrap 2 dòng làm ô méo, vỡ lưới liền
     mạch). white-space:nowrap ghi đè rule "normal" ở desktop. */
  .tuvi-ntx-wrap .ntx-cal-status { font-size: 7px; font-weight: 700; padding: 1.5px 5px; margin-top: 3px; border-radius: 6px; white-space: nowrap; max-width: calc(100% + 2px); }
  .tuvi-ntx-wrap .ntx-cal-today-tag { font-size: 6.5px; padding: 1px 4px; top: 2px; right: 2px; }
  .tuvi-ntx-wrap .ntx-legend-chip { font-size: 11px; padding: 4px 9px; }
}

@media (max-width: 360px) {
  .tuvi-ntx-wrap .ntx-cal-day { min-height: 70px; }
  .tuvi-ntx-wrap .ntx-cal-day .ntx-cal-dd { font-size: 14px; }
  .tuvi-ntx-wrap .ntx-cal-day .ntx-cal-am { font-size: 7px; }
  .tuvi-ntx-wrap .ntx-cal-status { font-size: 6.5px; padding: 1px 4px; }
}

@media (hover: none) {.tuvi-ntx-wrap .ntx-cal-day:hover { transform: none; }
}


/* Skeleton loading dùng chung cho cả 2 view */.tuvi-ntx-wrap .ntx-skeleton { border-radius: var(--ntx-radius); background: linear-gradient(90deg, rgba(212,175,55,.08) 25%, rgba(212,175,55,.18) 37%, rgba(212,175,55,.08) 63%); background-size: 400% 100%; animation: ntx-skel 1.4s ease infinite; }
@keyframes ntx-skel { 0% { background-position: 100% 50%; } 100% { background-position: 0 50%; } }

/* ═══════════════════════════════════════════════════
   SPLIT-VIEW (Master-Detail) — Lịch bên trái / Chi tiết bên phải
   trên Desktop, để giữ bối cảnh cả tháng khi xem 1 ngày.
   ═══════════════════════════════════════════════════ */.tuvi-ntx-wrap .ntx-split-view {
  display: block; /* Mobile/tablet: xếp chồng dọc — lịch trước, chi tiết ngay dưới */
}
/* Mobile: panel "Nhận định chung" nằm NGAY dưới lịch tháng, không để trống
   khoảng trắng — khoảng cách bằng đúng nhịp cách card tiêu chuẩn (14px,
   giống ntx-block), không thêm margin thừa nào khác. */.tuvi-ntx-wrap .ntx-split-side { margin-top: 16px; }.tuvi-ntx-wrap .ntx-quick-placeholder {
  display: none; /* chỉ hiện trên desktop, xem media query bên dưới */
}

@media (min-width: 900px) {.tuvi-ntx-wrap, .tuvi-ntx-wrap .tuvi-ntx-view[data-view="detail"] { max-width: 1080px; }.tuvi-ntx-wrap .ntx-split-view {
    display: grid;
    grid-template-columns: minmax(0, 70%) minmax(0, 30%);
    gap: 20px;
    align-items: start;
  }.tuvi-ntx-wrap .ntx-split-side {
    margin-top: 0;
    position: sticky;
    top: 20px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    max-height: calc(100vh - 40px); /* dự phòng, JS sẽ set đúng bằng chiều cao khối lịch */
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 2px; /* chừa chỗ cho thanh cuộn, tránh đè lên nội dung */
  }.tuvi-ntx-wrap .ntx-split-side .ntx-quick-block { margin-bottom: 0; flex-shrink: 0; padding: 14px 16px; }.tuvi-ntx-wrap .ntx-quick-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    min-height: 220px;
    flex: 1;
    border: 1px dashed var(--ntx-border);
    border-radius: var(--ntx-radius);
    padding: 24px;
    color: var(--ntx-text-muted);
    font-size: 13px;
  }
  /* Khi panel chi tiết đã có nội dung (JS set display:block), ẩn placeholder */.tuvi-ntx-wrap .ntx-quick-block[style*="display: block"] ~ .ntx-quick-placeholder { display: none; }
}.tuvi-ntx-wrap .ntx-quick-block, .tuvi-ntx-wrap .ntx-general-block { animation: ntx-fade-in .25s ease; }.tuvi-ntx-wrap .ntx-general-block { margin-top: 16px; margin-bottom: 0; padding-top: 20px; text-align: center; }.tuvi-ntx-wrap .ntx-general-block .ntx-conclusion { text-align: left; }.tuvi-ntx-wrap .ntx-tool-badge-standalone { margin: 0 0 14px; }
@keyframes ntx-fade-in { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: translateY(0); } }.tuvi-ntx-wrap .ntx-quick-err { font-size: 13px; color: var(--ntx-error); margin: 0; text-align: center; padding: 8px 0; }

/* ═══════════════════════════════════════════════════
   PANEL CHI TIẾT — "Seamless": không hộp lồng hộp, chỉ
   hairline (1px solid) phân cách từng nhóm thông tin.
   ═══════════════════════════════════════════════════ */.tuvi-ntx-wrap .ntx-panel-head {
  display: flex; align-items: baseline; gap: 10px;
  padding-bottom: 6px;
  margin-bottom: 6px;
  border-bottom: 1px solid var(--ntx-border);
}.tuvi-ntx-wrap .ntx-panel-dd {
  font-family: var(--ntx-font-title);
  font-variant-numeric: tabular-nums;
  font-size: 34px;
  font-weight: 700;
  line-height: 1;
  color: var(--ntx-primary);
  flex-shrink: 0;
}.tuvi-ntx-wrap .ntx-panel-headmid { min-width: 0; }.tuvi-ntx-wrap .ntx-panel-dow { font-size: 13px; font-weight: 600; color: var(--ntx-text); }.tuvi-ntx-wrap .ntx-panel-am { font-size: 12px; color: var(--ntx-text-muted); margin-top: 2px; }.tuvi-ntx-wrap .ntx-panel-section {
  padding: 6px 0;
  border-bottom: 1px solid var(--ntx-border);
}.tuvi-ntx-wrap .ntx-panel-section:last-of-type { border-bottom: none; padding-bottom: 2px; }.tuvi-ntx-wrap .ntx-panel-label {
  display: block;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--ntx-text-muted);
  margin-bottom: 3px;
}

/* Điểm số = KPI lớn nhất của cả panel: số to nhất trên toàn giao diện,
   sao ngay dưới, nhãn trạng thái viết hoa nhỏ — người dùng liếc panel
   là thấy con số này trước tiên, đúng nguyên tắc "3 giây biết ngay". */.tuvi-ntx-wrap .ntx-panel-energy { display: flex; flex-direction: column; align-items: flex-start; gap: 1px; }.tuvi-ntx-wrap .ntx-energy-tag {
  font-family: var(--ntx-font-title);
  font-variant-numeric: tabular-nums;
  font-size: 28px; font-weight: 700; line-height: 1;
  padding: 0;
  border-radius: 0;
  background: none !important;
}.tuvi-ntx-wrap .ntx-energy-tag.tot { color: var(--ntx-good); }.tuvi-ntx-wrap .ntx-energy-tag.binh_thuong { color: var(--ntx-neutral2); }.tuvi-ntx-wrap .ntx-energy-tag.xau { color: var(--ntx-bad); }.tuvi-ntx-wrap .ntx-energy-tag.chua_du_du_lieu { color: var(--ntx-nodata); }.tuvi-ntx-wrap .ntx-energy-stars {
  font-size: 14px; letter-spacing: 2px; line-height: 1; margin-top: 2px;
}.tuvi-ntx-wrap .ntx-energy-tag.tot ~ .ntx-energy-stars, .tuvi-ntx-wrap .ntx-panel-energy .ntx-energy-stars.tot { color: var(--ntx-good); }.tuvi-ntx-wrap .ntx-energy-stars.binh_thuong { color: var(--ntx-neutral2); }.tuvi-ntx-wrap .ntx-energy-stars.xau { color: var(--ntx-bad); }.tuvi-ntx-wrap .ntx-energy-stars.chua_du_du_lieu { color: var(--ntx-text-disabled); }.tuvi-ntx-wrap .ntx-energy-word {
  font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
  margin-top: 3px;
  padding: 2px 8px;
  border-radius: 999px;
}.tuvi-ntx-wrap .ntx-energy-word.tot { color: var(--ntx-good); background: var(--ntx-good-bg); }.tuvi-ntx-wrap .ntx-energy-word.binh_thuong { color: var(--ntx-neutral2); background: var(--ntx-neutral2-bg); }.tuvi-ntx-wrap .ntx-energy-word.xau { color: var(--ntx-bad); background: var(--ntx-bad-bg); }.tuvi-ntx-wrap .ntx-energy-word.chua_du_du_lieu { color: var(--ntx-nodata); background: var(--ntx-nodata-bg); }

/* Điểm nổi bật / Yếu tố cần lưu ý — danh sách phẳng, không còn thẻ/box bao quanh */.tuvi-ntx-wrap .ntx-panel-list { margin: 0; padding-left: 16px; font-size: 13px; line-height: 1.45; color: var(--ntx-text); }.tuvi-ntx-wrap .ntx-panel-list li::marker { color: var(--ntx-gold); }.tuvi-ntx-wrap .ntx-panel-list.is-caution li::marker { color: var(--ntx-bad); }

/* ═══════════════════════════════════════════════════
   CÔNG CỤ TRA CỨU NÂNG CAO — tách biệt hẳn khỏi lịch,
   đặt cuối trang, có đường phân cách rõ để không bị
   nhầm là 1 phần của lịch/chi tiết nhanh phía trên.
   ═══════════════════════════════════════════════════ */.tuvi-ntx-wrap .ntx-tool-card {
  margin-top: 36px;
  position: relative;
  padding: 0 24px 24px;
  overflow: hidden;
}
/* Thanh header nền Đỏ Đô "mở màn" cho khối công cụ nâng cao — cùng cặp
   token --ntx-maroon-* với header trang chủ và các block-title khác,
   giữ đúng 1 ngôn ngữ thị giác xuyên suốt toàn giao diện. */.tuvi-ntx-wrap .ntx-tool-head {
  margin: 0 -24px 18px;
  padding: 20px 24px 18px;
  background: linear-gradient(155deg, var(--ntx-maroon-bg) 0%, var(--ntx-maroon-bg-dark) 100%);
  text-align: center;
  position: relative;
}.tuvi-ntx-wrap .ntx-tool-head::after {
  content: '';
  position: absolute; left: 24px; right: 24px; bottom: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent 0%, var(--ntx-gold) 50%, transparent 100%);
  opacity: .5;
}.tuvi-ntx-wrap .ntx-tool-badge {
  display: inline-block;
  background: linear-gradient(180deg, var(--ntx-gold-light) 0%, var(--ntx-gold) 100%);
  border: 1px solid #8A6D1F;
  color: var(--ntx-primary);
  padding: 5px 14px;
  border-radius: 999px;
  font-size: 10.5px;
  letter-spacing: .1em;
  text-transform: uppercase;
  font-weight: 800;
  margin: 0 0 12px;
  font-family: var(--ntx-font);
  box-shadow: var(--ntx-shadow-gold-btn);
}.tuvi-ntx-wrap .ntx-tool-head .tuvi-ntx-title { text-align: center; margin-bottom: 6px; color: #FBEFD4; }.tuvi-ntx-wrap .ntx-tool-desc { font-size: 13px; color: var(--ntx-maroon-text); opacity: .9; text-align: center; margin: 0; }

/* ═══════════════════════════════════════════════════
   CHỌN NGÀY TỐT — danh sách ngày tìm được trong tối đa
   3 tháng tới. Mỗi ngày là 1 thẻ chọn được, dùng ĐÚNG
   token màu trạng thái để đồng bộ với lịch tháng.
   ═══════════════════════════════════════════════════ */.tuvi-ntx-wrap .ntx-search-results { margin-top: 16px; }.tuvi-ntx-wrap .ntx-search-results-head {
  margin-bottom: 8px;
}.tuvi-ntx-wrap .ntx-search-results-row {
  display: flex; align-items: baseline; justify-content: space-between;
}.tuvi-ntx-wrap .ntx-search-results-title { font-size: 13px; font-weight: 700; color: var(--ntx-text); }.tuvi-ntx-wrap .ntx-search-results-criteria { display: block; font-size: 11.5px; color: var(--ntx-text-muted); margin-top: 2px; }.tuvi-ntx-wrap .ntx-search-results-sub { font-size: 12px; color: var(--ntx-text-muted); }.tuvi-ntx-wrap .ntx-search-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(108px, 1fr));
  gap: 8px;
}.tuvi-ntx-wrap .ntx-search-item {
  position: relative;
  min-width: 0;
  text-align: center;
  border: 1.5px solid var(--ntx-border);
  border-radius: 10px;
  padding: 12px 8px 8px;
  background: var(--ntx-bg);
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
  overflow: hidden;
  transition: box-shadow .18s cubic-bezier(.4,0,.2,1), transform .18s cubic-bezier(.4,0,.2,1), background-color .18s ease;
}.tuvi-ntx-wrap .ntx-search-item:hover { box-shadow: 0 4px 14px rgba(15,23,42,.10); transform: scale(1.02); }.tuvi-ntx-wrap .ntx-search-item:focus-visible { outline: 2px solid var(--ntx-primary); outline-offset: 2px; }.tuvi-ntx-wrap .ntx-search-item.tot { border-color: var(--ntx-good-border); }.tuvi-ntx-wrap .ntx-search-item.binh_thuong { border-color: var(--ntx-neutral2-border); }.tuvi-ntx-wrap .ntx-search-item .dd { font-family: var(--ntx-font-title); font-size: 20px; font-weight: 700; line-height: 1; color: var(--ntx-text); }.tuvi-ntx-wrap .ntx-search-item .mm { font-size: 10.5px; color: var(--ntx-text-muted); margin-top: 2px; }.tuvi-ntx-wrap .ntx-search-item .am { font-size: 10px; color: var(--ntx-text-muted); margin-top: 3px; }.tuvi-ntx-wrap .ntx-search-item .stars { font-size: 11px; letter-spacing: 1px; margin-top: 6px; display: block; }.tuvi-ntx-wrap .ntx-search-item.tot .stars { color: var(--ntx-good); }.tuvi-ntx-wrap .ntx-search-item.binh_thuong .stars { color: var(--ntx-neutral2); }.tuvi-ntx-wrap .ntx-search-item.selected {
  border-width: 2px; border-color: var(--ntx-primary);
  background: rgba(212,175,55,.045);
  box-shadow: 0 0 0 3px rgba(212,175,55,.10);
}
/* Nhãn "Phù hợp" / "Hợp tuổi" — đặt trong luồng, ngay dưới thông tin ngày,
   không còn định vị absolute đè lên các phần tử khác gây tràn/vỡ layout. */.tuvi-ntx-wrap .ntx-search-badges {
  display: flex; flex-wrap: wrap; justify-content: center; gap: 4px;
  margin-top: 8px; max-width: 100%;
}.tuvi-ntx-wrap .ntx-search-match {
  font-size: 8.5px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase;
  color: #FFFFFF; background: var(--ntx-good);
  padding: 3px 8px; border-radius: 999px;
  box-shadow: 0 1px 3px rgba(15,23,42,.15);
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}.tuvi-ntx-wrap .ntx-search-match-tuoi { background: var(--ntx-gold, var(--ntx-primary)); color: var(--ntx-ink); }.tuvi-ntx-wrap .ntx-search-empty { font-size: 13px; color: var(--ntx-text-muted); text-align: center; padding: 16px 0; }

/* Thẻ "Xem trước miễn phí" — nổi bật hẳn để người dùng thấy ngay giá trị
   thật (không phải hình minh hoạ) trước khi được mời mở khoá. */.tuvi-ntx-wrap .ntx-search-item.is-preview {
  border-width: 2px;
  border-color: var(--ntx-gold);
  background: rgba(212,175,55,.06);
}.tuvi-ntx-wrap .ntx-search-preview-tag {
  display: inline-block;
  line-height: 1.5;
  font-size: 9.5px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase;
  color: var(--ntx-maroon-text);
  background: linear-gradient(155deg, var(--ntx-maroon-bg) 0%, var(--ntx-maroon-bg-dark) 100%);
  border: 1px solid var(--ntx-gold);
  border-radius: 999px;
  padding: 3px 9px;
  margin-bottom: 6px;
  white-space: nowrap;
}

/* E2: tag giá nhỏ trên mỗi thẻ khoá — giảm bất định về chi phí trước khi
   người dùng kéo hết xuống mới thấy giá ở CTA cuối cùng. */.tuvi-ntx-wrap .ntx-search-price-tag {
  display: inline-block;
  line-height: 1.5;
  font-size: 9.5px; font-weight: 800; letter-spacing: .02em;
  color: var(--ntx-gold-ink);
  background: var(--ntx-nodata-bg);
  border: 1px solid var(--ntx-border);
  border-radius: 999px;
  padding: 3px 9px;
  margin-bottom: 6px;
  white-space: nowrap;
}

/* Thẻ đang khoá — KHÔNG còn gắn class xếp loại (tot/binh_thuong/xau) nên
   viền/nền không lộ ngày đó tốt hay xấu; sao cũng render rỗng đồng nhất
   ở mọi thẻ (không phải sao thật bị blur) — người dùng không thể đoán
   được chất lượng ngày dù có nhìn kỹ đến đâu, chỉ mở khoá mới biết. Blur
   nhẹ dưới đây chỉ còn là hiệu ứng thẩm mỹ tạo cảm giác "đang khoá". E1:
   trước đây chấm dùng màu trung tính giống hệt tông xám của legend "chưa
   đủ dữ liệu" → dễ hiểu nhầm là "trống rỗng" thay vì "có nhưng bị khoá".
   Đổi sang tông vàng gold (ngôn ngữ "cao cấp/trả phí" đã dùng ở CTA, badge
   ★, thẻ preview...) + blur đậm hơn, tạo cảm giác "có thứ hay đang bị
   giấu" — không dùng màu tốt/xấu thật nên vẫn không lộ xếp loại. */.tuvi-ntx-wrap .ntx-search-item.is-locked { cursor: pointer; background: var(--ntx-bg-hover); padding-bottom: 22px; }.tuvi-ntx-wrap .ntx-search-item.is-locked .dd, .tuvi-ntx-wrap .ntx-search-item.is-locked .mm, .tuvi-ntx-wrap .ntx-search-item.is-locked .am, .tuvi-ntx-wrap .ntx-search-item.is-locked .stars {
  filter: blur(2.5px);
  user-select: none;
  opacity: .5;
}.tuvi-ntx-wrap .ntx-search-item.is-locked .stars { color: var(--ntx-gold); }.tuvi-ntx-wrap .ntx-search-item.is-locked::after {
  content: 'Chạm để mở khoá';
  position: absolute;
  left: 0; right: 0; bottom: 6px;
  font-size: 8px; font-weight: 700; letter-spacing: .03em;
  color: var(--ntx-gold-ink);
  text-align: center;
}

/* Thẻ mời mở khoá — liệt kê rõ giá trị nhận được thay vì chỉ ghi khô
   khan "Nâng cấp / Trả phí", đặt ngay dưới danh sách ngày. Bố cục: tiêu
   đề căn giữa trên cùng → hàng ngang gồm danh sách quyền lợi (trái) +
   nút CTA (phải) → chú thích căn giữa dưới cùng. Dưới 560px tự xếp
   chồng dọc để không bị bó hẹp nội dung. Nền đổi từ trắng phẳng sang
   gradient kem-vàng ấm + viền Vàng Kim dày hơn có glow ring ngoài, để
   khối này nổi bật rõ ràng là 1 lời mời đặc biệt chứ không lẫn vào
   card thường. */.tuvi-ntx-wrap .ntx-unlock-card {
  margin-top: 14px;
  background: linear-gradient(160deg, #FFFDF6 0%, #FBF1D8 100%);
  border: 2px solid var(--ntx-gold);
  border-radius: var(--ntx-radius);
  padding: 20px 24px;
  text-align: center;
  position: relative;
  box-shadow: 0 0 0 4px rgba(184,138,34,.10), 0 10px 28px rgba(82,20,20,.14), var(--ntx-shadow-premium);
}.tuvi-ntx-wrap .ntx-unlock-card::before {
  /* Viền chỉ mảnh bên trong — tạo hiệu ứng "viền đúp" sang trọng thay vì
     1 đường viền đơn điệu. */
  content: '';
  position: absolute; inset: 4px;
  border: 1px solid rgba(184,138,34,.35);
  border-radius: calc(var(--ntx-radius) - 3px);
  pointer-events: none;
}.tuvi-ntx-wrap .ntx-unlock-card h4 {
  margin: 0 0 14px;
  font-family: var(--ntx-font-title);
  font-size: 18px; font-weight: 700;
  color: var(--ntx-primary);
  position: relative;
}.tuvi-ntx-wrap .ntx-unlock-body {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  text-align: left;
  position: relative;
}.tuvi-ntx-wrap .ntx-unlock-card ul {
  list-style: none; margin: 0; padding: 0;
  flex: 1 1 auto;
  min-width: 0;
}.tuvi-ntx-wrap .ntx-unlock-card li {
  font-size: 13px; line-height: 1.7; color: var(--ntx-text);
  padding-left: 16px;
  position: relative;
}.tuvi-ntx-wrap .ntx-unlock-card li::before {
  content: '—';
  position: absolute; left: 0;
  color: var(--ntx-gold);
}
/* Nút CTA chính trong khối paywall — cùng cặp nền Đỏ Đô/chữ Vàng Kim với
   mọi nút bấm chọn + nút thanh toán khác, chữ IN HOA + width tự nhiên
   (không full-width) vì nằm cạnh danh sách quyền lợi. Thêm hiệu ứng ánh
   sáng: quầng glow vàng phát sáng nhẹ nhàng xung quanh nút (pulse chậm,
   không chớp giật) để hút mắt đúng vị trí hành động chính. */.tuvi-ntx-wrap .ntx-unlock-btn.tuvi-ntx-btn {
  flex: 0 0 auto;
  width: auto;
  min-width: 220px;
  margin: 0;
  text-transform: uppercase;
  letter-spacing: .02em;
  white-space: nowrap;
  position: relative;
  animation: ntxUnlockGlow 2.6s ease-in-out infinite;
}
@keyframes ntxUnlockGlow {
  0%, 100% { box-shadow: var(--ntx-shadow-maroon-btn), 0 0 0 0 rgba(212,175,55,.35); }
  50%      { box-shadow: var(--ntx-shadow-maroon-btn), 0 0 16px 4px rgba(212,175,55,.45); }
}
@media (hover: none) {.tuvi-ntx-wrap .ntx-unlock-btn.tuvi-ntx-btn { animation: none; }
}
@media (max-width: 560px) {.tuvi-ntx-wrap .ntx-unlock-body { flex-direction: column; align-items: stretch; gap: 16px; }.tuvi-ntx-wrap .ntx-unlock-card ul { text-align: left; }.tuvi-ntx-wrap .ntx-unlock-btn.tuvi-ntx-btn { width: 100%; min-width: 0; }
}

/* Luận giải chuyên môn — kết quả TRẢ PHÍ của "Chọn Ngày Tốt". Chỉ là văn
   bản luận giải cho đúng ngày/việc đã chọn, KHÔNG lặp lại bảng Can Chi,
   Trực, Việc nên làm/tránh... (những dữ liệu đó đã có miễn phí ở lịch
   tháng) — tránh trùng lặp, giữ đúng vai trò "nội dung trả phí = luận
   giải chuyên sâu", không phải bảng tra cứu. */.tuvi-ntx-wrap .ntx-narrative-card { padding-top: 4px; }.tuvi-ntx-wrap .ntx-narrative-head {
  display: flex; align-items: baseline; gap: 8px;
  margin-bottom: 10px; padding-bottom: 12px;
  border-bottom: 1px solid var(--ntx-border);
}.tuvi-ntx-wrap .ntx-narrative-date { font-family: var(--ntx-font-title); font-weight: 700; font-size: 18px; color: var(--ntx-primary); }.tuvi-ntx-wrap .ntx-narrative-viec { font-size: 12.5px; color: var(--ntx-text-muted); }.tuvi-ntx-wrap .ntx-narrative-label {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 10.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
  color: var(--ntx-gold-ink); margin-bottom: 8px;
}.tuvi-ntx-wrap .ntx-narrative-body { font-size: 14px; line-height: 1.75; color: var(--ntx-text); }

/* Kết luận cốt lõi — đặt NGAY đầu, đọc 1 dòng là biết ngày này ra sao,
   đúng nguyên tắc "hiển thị giật cấp": đáp án trước, chi tiết sau. */.tuvi-ntx-wrap .ntx-narrative-verdict {
  display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap;
  padding: 12px 14px;
  border-radius: var(--ntx-radius);
  margin-bottom: 14px;
  border: 1px solid var(--ntx-border);
}.tuvi-ntx-wrap .ntx-narrative-verdict.tot { background: var(--ntx-good-bg); border-color: var(--ntx-good-border); }.tuvi-ntx-wrap .ntx-narrative-verdict.xau { background: var(--ntx-bad-bg); border-color: var(--ntx-bad-border); }.tuvi-ntx-wrap .ntx-narrative-verdict.binh_thuong { background: var(--ntx-neutral2-bg); border-color: var(--ntx-neutral2-border); }.tuvi-ntx-wrap .ntx-narrative-verdict-tag {
  font-family: var(--ntx-font-title);
  font-weight: 800; font-size: 15px; letter-spacing: .02em; white-space: nowrap;
}.tuvi-ntx-wrap .ntx-narrative-verdict.tot .ntx-narrative-verdict-tag { color: var(--ntx-good); }.tuvi-ntx-wrap .ntx-narrative-verdict.xau .ntx-narrative-verdict-tag { color: var(--ntx-bad); }.tuvi-ntx-wrap .ntx-narrative-verdict.binh_thuong .ntx-narrative-verdict-tag { color: var(--ntx-neutral2); }.tuvi-ntx-wrap .ntx-narrative-verdict-text { font-size: 13px; line-height: 1.5; color: var(--ntx-text); }

/* Ba khối trực quan (Việc nên làm / Việc nên kiêng / Hướng xuất hành) —
   dùng lại đúng style .ntx-viec-grid/.ntx-viec-col đã có, đặt cách nhau
   rõ ràng với đoạn văn luận giải bên dưới. */.tuvi-ntx-wrap .ntx-narrative-grid { margin-bottom: 14px; }.tuvi-ntx-wrap .ntx-narrative-huong {
  background: var(--ntx-bg-page);
  border: 1px solid var(--ntx-border);
  border-radius: var(--ntx-radius);
  padding: 12px 14px;
  margin-bottom: 16px;
}.tuvi-ntx-wrap .ntx-narrative-huong h4 {
  margin: 0 0 6px; font-size: 13px; font-weight: 700; color: var(--ntx-primary);
}

/* Luận giải chuyên môn — thu gọn mặc định khi đã có 3 khối trực quan ở
   trên, người đọc chỉ mở ra khi thật sự muốn đọc bản phân tích đầy đủ. */.tuvi-ntx-wrap .ntx-narrative-body.is-collapsible.collapsed {
  max-height: 96px;
  overflow: hidden;
  position: relative;
  -webkit-mask-image: linear-gradient(180deg, #000 60%, transparent 100%);
          mask-image: linear-gradient(180deg, #000 60%, transparent 100%);
}.tuvi-ntx-wrap .ntx-narrative-toggle {
  display: flex;
  align-items: center;
  gap: 5px;
  margin-top: 8px;
  background: none;
  border: none;
  color: var(--ntx-primary);
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  padding: 0;
  font-family: var(--ntx-font);
}.tuvi-ntx-wrap .ntx-narrative-toggle .ntx-narrative-toggle-label { text-decoration: underline; }
.tuvi-ntx-wrap .ntx-narrative-toggle .ntx-chevron {
  display: inline-block;
  font-size: 11px;
  transition: transform .15s ease;
}.tuvi-ntx-wrap .ntx-narrative-toggle.is-open .ntx-chevron { transform: rotate(90deg); }

/* Tuổi hợp / xung (thẻ kết quả nhanh) — 2 badge tách biệt thay vì 1 dòng
   text dài dễ díu chữ, dùng đúng token màu tốt/xấu đã có sẵn trong hệ
   thống (đồng bộ với .ntx-badge, viền ô lịch...). */.tuvi-ntx-wrap .ntx-hopxung-row {
  display: flex; flex-wrap: wrap; gap: 6px;
  margin-top: 6px;
}.tuvi-ntx-wrap .ntx-hopxung-badge {
  display: inline-block;
  font-size: 12px; font-weight: 600; line-height: 1.4;
  padding: 3px 10px;
  border-radius: 999px;
  border: 1px solid transparent;
}.tuvi-ntx-wrap .ntx-hopxung-badge.hop { background: var(--ntx-good-bg); border-color: var(--ntx-good-border); color: var(--ntx-good); }.tuvi-ntx-wrap .ntx-hopxung-badge.xung { background: var(--ntx-bad-bg); border-color: var(--ntx-bad-border); color: var(--ntx-bad); }

/* ═══════════════════════════════════════════════════
   MODAL THANH TOÁN — mở khoá "Hỏi AI câu hỏi riêng".
   Dùng lại toàn bộ token --ntx-* để đồng bộ với phần
   còn lại của giao diện (và với tuvi.css của Client).
   ═══════════════════════════════════════════════════ */.tuvi-ntx-wrap .ntx-modal-overlay {
  position: fixed; inset: 0; z-index: 999999; /* luôn nổi trên thanh menu của theme */
  background: rgba(42, 26, 18, .55);
  display: flex; align-items: center; justify-content: center;
  padding: 16px;
  isolation: isolate;
}.tuvi-ntx-wrap .ntx-modal {
  background: var(--ntx-bg);
  border: 1px solid var(--ntx-border);
  border-radius: 14px;
  width: 100%; max-width: 420px;
  max-height: 90vh;
  display: flex; flex-direction: column;
  overflow: hidden;
  font-family: var(--ntx-font);
  box-shadow: 0 24px 60px rgba(42, 26, 18, .40);
}.tuvi-ntx-wrap .ntx-modal-header {
  display: flex; align-items: center; gap: 8px;
  position: relative;
  padding: 18px 44px 16px 22px;
  background: linear-gradient(155deg, var(--ntx-maroon-bg) 0%, var(--ntx-maroon-bg-dark) 100%);
}.tuvi-ntx-wrap .ntx-modal-header::after {
  content: '';
  position: absolute;
  left: 22px; right: 22px; bottom: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent 0%, var(--ntx-gold) 50%, transparent 100%);
  opacity: .5;
}.tuvi-ntx-wrap .ntx-modal-close {
  position: absolute;
  top: 14px; right: 14px;
  width: 32px; height: 32px;
  display: inline-flex; align-items: center; justify-content: center;
  border: none; border-radius: 50%;
  background: rgba(233,196,104,.12);
  color: var(--ntx-maroon-text);
  font-size: 16px; line-height: 1;
  cursor: pointer;
}.tuvi-ntx-wrap .ntx-modal-close:hover { background: rgba(233,196,104,.22); color: #FBEFD4; }.tuvi-ntx-wrap .ntx-modal-header h3 {
  margin: 0; font-family: var(--ntx-font-title);
  color: #FBEFD4; font-size: 18px; font-weight: 700;
  line-height: 1.3;
}.tuvi-ntx-wrap .ntx-modal-body { padding: 20px 22px; overflow-y: auto; }.tuvi-ntx-wrap .ntx-modal-desc { font-size: 13.5px; line-height: 1.6; color: var(--ntx-text-muted); text-align: center; margin: 0 0 16px; }.tuvi-ntx-wrap .ntx-modal-price {
  text-align: center; margin: 4px 0 16px;
  padding: 16px 12px;
  border-radius: 12px;
  background: linear-gradient(180deg, rgba(212,175,55,.10) 0%, rgba(212,175,55,.05) 100%);
  border: 1px solid var(--ntx-gold);
}.tuvi-ntx-wrap .ntx-modal-price-cur {
  font-family: var(--ntx-font-title);
  font-size: 18px; font-weight: 700; color: var(--ntx-primary);
  vertical-align: top; margin-left: 2px;
}.tuvi-ntx-wrap .ntx-modal-price #ntxPayAmount {
  font-family: var(--ntx-font-title);
  font-size: 34px; font-weight: 700; color: var(--ntx-primary);
}.tuvi-ntx-wrap .ntx-modal-price small { display: block; color: var(--ntx-text-muted); font-size: 12px; margin-top: 4px; }

/* Danh sách cam kết — tạo cảm giác an tâm trước khi thanh toán */.tuvi-ntx-wrap .ntx-trust-list {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-direction: column; gap: 8px;
}.tuvi-ntx-wrap .ntx-trust-list li {
  display: flex; align-items: flex-start; gap: 8px;
  font-size: 13px; line-height: 1.5; color: var(--ntx-text);
}.tuvi-ntx-wrap .ntx-modal-footer {
  display: flex; flex-wrap: wrap; gap: 8px; padding: 16px 24px;
  border-top: 1px solid var(--ntx-border);
  background: var(--ntx-bg-hover);
}.tuvi-ntx-wrap .ntx-modal-footer .tuvi-ntx-btn { flex: 1 1 auto; margin: 0; width: 100%; }.tuvi-ntx-wrap .ntx-modal-footer-step0 { flex-direction: column; }.tuvi-ntx-wrap .ntx-secure-hint {
  display: flex; align-items: center; justify-content: center; gap: 4px;
  width: 100%; font-size: 11.5px; color: var(--ntx-text-muted);
}.tuvi-ntx-wrap .ntx-qr-wrap { text-align: center; margin: 8px 0 16px; }.tuvi-ntx-wrap .ntx-qr-wrap img { width: 200px; height: 200px; border-radius: 8px; border: 1px solid var(--ntx-border); }.tuvi-ntx-wrap .ntx-qr-fallback {
  width: 200px; margin: 0 auto;
  padding: 24px 14px;
  border: 1px dashed var(--ntx-gold);
  border-radius: 8px;
  background: var(--ntx-bg-page);
  color: var(--ntx-text-muted);
  font-size: 12px; line-height: 1.5;
  align-items: center; justify-content: center;
}.tuvi-ntx-wrap .ntx-modal-flat-btn {
  display: block;
  width: 100%;
  background: none; border: none;
  color: var(--ntx-text-muted);
  font-size: 13px;
  padding: 8px 0 0;
  cursor: pointer;
  text-align: center;
}.tuvi-ntx-wrap .ntx-modal-flat-btn:hover { color: var(--ntx-text); text-decoration: underline; }.tuvi-ntx-wrap .ntx-bank-info {
  background: var(--ntx-bg); border: 1px solid var(--ntx-border); border-radius: 8px;
  padding: 12px 16px; display: flex; flex-direction: column; gap: 8px;
  margin-bottom: 8px;
}.tuvi-ntx-wrap .ntx-bank-row { display: flex; justify-content: space-between; align-items: center; font-size: 13px; gap: 8px; }.tuvi-ntx-wrap .ntx-bank-row span { color: var(--ntx-text-muted); }.tuvi-ntx-wrap .ntx-bank-row strong { color: var(--ntx-text); text-align: right; word-break: break-word; }.tuvi-ntx-wrap .ntx-amount-highlight { color: var(--ntx-primary) !important; font-size: 16px; }.tuvi-ntx-wrap .ntx-modal-hint { font-size: 12px; color: var(--ntx-text-muted); text-align: center; margin: 0 0 16px; }.tuvi-ntx-wrap .ntx-checking-wrap {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  font-size: 13px; color: var(--ntx-text-muted); margin-bottom: 12px;
}.tuvi-ntx-wrap .ntx-checking-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--ntx-gold);
  animation: ntxPulse 1.1s infinite ease-in-out;
}
@keyframes ntxPulse { 0%,100% { opacity: .35; } 50% { opacity: 1; } }.tuvi-ntx-wrap .ntx-success-wrap { text-align: center; padding: 8px 0; }.tuvi-ntx-wrap .ntx-success-badge {
  width: 56px; height: 56px; border-radius: 50%; margin: 0 auto 16px;
  background: var(--ntx-success); color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: 28px; font-weight: 700;
}.tuvi-ntx-wrap .ntx-success-wrap h4 { margin: 0 0 8px; color: var(--ntx-text); font-family: var(--ntx-font-title); font-size: 19px; }.tuvi-ntx-wrap .ntx-success-wrap p { margin: 0; font-size: 13px; color: var(--ntx-text-muted); }

@media (max-width: 480px) {.tuvi-ntx-wrap .ntx-modal { max-width: 100%; }
}