:root{
  --tv-border:#222;
  --tv-bg:#f4efe6;
  --tv-paper:#f7f2ea;
  --tv-text:#111;
  --tv-muted:#6b7280;

  --tv-main:#c1121f;       /* 14 chính tinh */
  --tv-good:#0f766e;       /* cát tinh */
  --tv-bad:#b45309;        /* hung/sát tinh */
  --tv-transform:#7c3aed;  /* tứ hóa */
  --tv-loc:#15803d;        /* lộc tồn */

  --tv-primary:#2563eb;
}

/* wrapper */
.tuvilaso-wrap{
  max-width: 1100px;
  margin: 0 auto;
  padding: 18px 10px 36px;
  color: var(--tv-text);
}

.tuvilaso-card{
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 16px;
  padding: 16px;
  margin: 14px 0;
}

.tuvilaso-title{
  margin: 0 0 12px;
  font-size: 20px;
  font-weight: 800;
}

/* ===== form ===== */
.tuvilaso-form .row{ margin: 12px 0; }
.tuvilaso-form label{ display:block; font-weight:700; margin-bottom: 6px; }

.grid3{ display:grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.grid2{ display:grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }

input[type="number"], select{
  width: 100%;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  padding: 10px 12px;
  outline: none;
}

.radio{
  display:flex;
  align-items:center;
  gap: 8px;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  padding: 10px 12px;
}

.tuvilaso-btn{
  width:100%;
  background: var(--tv-primary);
  color: #fff;
  border: 0;
  border-radius: 14px;
  padding: 12px 14px;
  font-weight: 800;
  font-size: 16px;
  cursor:pointer;
}

.tuvilaso-note{
  margin-top: 10px;
  color: var(--tv-muted);
  font-size: 13px;
}

/* ===== status meta ===== */
.tuvilaso-status{
  border: 1px dashed #e5e7eb;
  border-radius: 14px;
  padding: 12px;
  color: var(--tv-text);
  background:#fff;
}

.tv-meta-lite{
  display:flex;
  flex-wrap:wrap;
  gap: 10px 18px;
  font-size: 13px;
}
.tv-meta-lite b{ font-weight: 800; }

/* =========================================================
   TOOLBAR
========================================================= */
.tv-toolbar{
  display:flex;
  align-items:center;
  gap: 10px;
  flex-wrap:wrap;
  margin: 10px 0 10px;
}

.tv-btn{
  border: 1px solid #e5e7eb;
  background: #fff;
  border-radius: 12px;
  padding: 9px 12px;
  font-weight: 900;
  cursor:pointer;
  transition: transform .06s ease;
}
.tv-btn:active{ transform: translateY(1px); }

.tv-toolbar-note{
  font-size: 12px;
  color: var(--tv-muted);
  font-weight: 700;
}

/* =========================================================
   BOARD kiểu lá số truyền thống (default)
========================================================= */
.tv-board-wrap{
  width: 100%;
  overflow: auto;
}

.tv-board{
  min-width: 980px;
  background: var(--tv-bg);
  border: 2px solid var(--tv-border);
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: repeat(4, 1fr);
}

/* mỗi ô cung */
.tv-cell{
  position: relative;
  box-sizing: border-box;
  border: 1px solid var(--tv-border);
  padding: 22px 10px 26px; /* chừa top cho corner, chừa đáy cho bottom row */
  background: rgba(255,255,255,.18);
  min-height: 175px;
  cursor: pointer;
}
.tv-cell:hover{ background: rgba(255,255,255,.30); }

/* 4 góc */
.tv-corner{
  font-size: 11px;
  font-weight: 700;
  opacity: .9;
}
.tv-corner.tv-tl{ position:absolute; left:8px; top:6px; text-align:left; }
.tv-corner.tv-tr{ position:absolute; right:8px; top:6px; text-align:right; }
.tv-corner.tv-bl{ position:absolute; left:8px; bottom:6px; text-align:left; }
.tv-corner.tv-br{ position:absolute; right:8px; bottom:6px; text-align:right; }

/* tên cung */
.tv-pname{
  text-align:center;
  font-weight: 800;
  letter-spacing: .3px;
  text-transform: uppercase;
  font-size: 14px;
  margin-bottom: 6px;
  color:#c1121f;
}

/* sao chính */
.tv-mainwrap{
  text-align: center;
  min-height: 38px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  margin: 2px 0 8px;
}
.tv-mainwrap-empty{ opacity: .35; }

.tv-mainbig{
  font-weight: 800;
  font-size: 18px;
  line-height:1.15;
  letter-spacing: .1px;
}

/* sao phụ 2 cột chuẩn */
.tv-stars{
  display:grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 18px;
  align-items:start;
  margin-top: 6px;
}

.tv-subcol{
  display:flex;
  flex-direction:column;
  gap: 2px;
}

.tv-s{
  display:block;
  line-height:1.25;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  font-size: 12px;
  color:#111;
}

/* phân màu sao */
.tv-s.tv-main{ color:#0b4fd6; font-weight:800; }     /* chính tinh xanh dương như mẫu */
.tv-s.tv-transform{ color:#7a1cff; font-weight:700; }/* tứ hóa */
.tv-s.tv-loc{ color:#0a8a3a; font-weight:700; }      /* lộc tồn */
.tv-s.tv-good{ color:#d00000; font-weight:700; }     /* cát tinh */
.tv-s.tv-bad{ color:#3b3b3b; font-weight:650; }      /* hung */
.tv-muted{ color: var(--tv-muted); opacity:.55; }

/* bottom row (ĐV | Trường Sinh | LN) */
.tv-bottom-row{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:10px;
  margin-top:6px;
  font-size:13px;
  line-height:1.1;
}
.tv-bottom-left{ width:33%; text-align:left; }
.tv-bottom-mid{  width:34%; text-align:center; font-weight:700; }
.tv-bottom-right{width:33%; text-align:right; }

/* ================= center 2x2 ================= */
.tv-center{
  border: 1px solid var(--tv-border);
  background: var(--tv-paper);
  position: relative;
  min-height: 350px;
  overflow: hidden;
}

.tv-center-inner{
  position: relative;
  z-index: 2;
  padding: 18px 18px 12px;
}

.tv-center-title{
  font-size: 22px;
  font-weight: 950;
  text-align:center;
  margin-bottom: 6px;
}

.tv-center-sub{
  font-size: 12px;
  color:#333;
  text-align:center;
  margin-bottom: 14px;
}

/* ✅ 1 CỘT DỌC (không chia 2 cột) */
.tv-center-col{
  display:flex;
  flex-direction: column;
  gap: 8px;
  font-size: 13px;
}
.tv-center-col b{ font-weight: 950; }

.tv-center-lines{
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:1;
  background:
    linear-gradient(135deg, transparent 49.4%, rgba(0,0,0,.35) 49.8%, transparent 50.2%),
    linear-gradient(45deg,  transparent 49.4%, rgba(0,0,0,.35) 49.8%, transparent 50.2%);
  opacity:.18;
}

/* =========================================================
   POPUP PHÓNG TO
========================================================= */
.tv-modal{
  position: fixed;
  inset: 0;
  display:none;
  z-index: 999999;
}
.tv-modal.is-open{ display:block; }

.tv-modal-overlay{
  position:absolute;
  inset:0;
  background: rgba(0,0,0,.55);
}

.tv-modal-box{
  position:absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
  width: min(860px, 92vw);
  max-height: 86vh;
  overflow:auto;
  background: #fff;
  border-radius: 18px;
  border: 2px solid #111;
  padding: 16px 16px 18px;
}

.tv-modal-x{
  position:absolute;
  top: 8px;
  right: 10px;
  width: 36px;
  height: 36px;
  border-radius: 12px;
  border: 1px solid #e5e7eb;
  background: #fff;
  font-size: 22px;
  font-weight: 900;
  cursor:pointer;
}

.tv-modal-title{
  font-weight: 950;
  font-size: 18px;
  margin: 6px 0 10px;
  text-transform: uppercase;
}
.tv-modal-chi{
  font-size: 13px;
  color: #555;
  font-weight: 800;
  margin-left: 8px;
}

.tv-modal-main{
  display:flex;
  gap: 8px;
  flex-wrap:wrap;
  justify-content:center;
  margin: 8px 0 10px;
}

.tv-modal-mainstar{
  font-size: 18px;
  font-weight: 950;
  color: var(--tv-main);
  padding: 6px 10px;
  border: 1px dashed rgba(0,0,0,.25);
  border-radius: 12px;
  background: #fff7f7;
}

.tv-modal-nomain{ color: var(--tv-muted); font-weight: 800; }

.tv-modal-stars{
  column-count: 3;
  column-gap: 18px;
  font-size: 13px;
  line-height: 1.35;
  padding: 6px 6px 0;
}

/* =========================================================
   THEME: CỔ HỌC (ảnh 2)
========================================================= */
.tv-board.tv-theme-cohoc{
  background: #f2eadc;
  border: 1.6px solid #2b2b2b;
  font-family: Arial, Helvetica, sans-serif;
  width: 900px;
  height: 1250px;
  margin: 0 auto;
  transform-origin: top left;
  transform: scale(.6);
}

.tv-board-wrap{ min-height: 650px; }

.tv-cell.tv-cell-cohoc{
  position:relative;
  overflow: visible !important;
  background: transparent;
  min-height: 148px;
  padding: 10px 8px 8px;
  border: 1px solid #2b2b2b;
}
.tv-cell.tv-cell-cohoc:hover{ background: rgba(255,255,255,.10); }

/* 4 góc nhỏ (cohoc) */
.tv-cell.tv-cell-cohoc .tv-corner{
  position:absolute;
  font-size: 10.5px;
  line-height: 1;
  color:#111;
  font-weight: 700;
  opacity:.95;
}
.tv-tl{ top:6px; left:6px; }
.tv-tr{ top:6px; right:6px; text-align:right; }
.tv-bl{ bottom:6px; left:6px; }
.tv-br{ bottom:6px; right:6px; text-align:right; }

/* tên cung đỏ ở giữa (cohoc) */
.tv-board.tv-theme-cohoc .tv-pname{
  font-weight: 800 !important;
}

/* chính tinh (cohoc) */
.tv-cell-cohoc .tv-mainwrap{
  margin: 0 0 6px;
  min-height: 26px;
}
.tv-cell-cohoc .tv-mainbig{
  font-size: 13px;
  font-weight: 800;
  line-height: 1.15;
}

/* sao phụ (cohoc) */
.tv-cell-cohoc .tv-stars{
  font-size: 10.5px;
  line-height: 1.15;
}
.tv-cell-cohoc .tv-s{ margin: 1.5px 0; }

/* ===== Center cổ học ===== */
.tv-center.tv-center-cohoc{
  background:#f7f1e6;
  border: 1px solid #2b2b2b;
  position: relative;
  overflow: hidden;
}

.tv-center-cohoc .tv-center-inner{
  padding: 14px 18px 46px !important;
}

.tv-center-brand{ text-align:center; margin-bottom: 6px; }
.tv-brand-top{ font-size: 11px; font-weight: 900; letter-spacing: .2px; }
.tv-brand-link{ font-size: 11px; font-weight: 900; color:#0b63ce; margin-top: 2px; }
.tv-brand-phone{ font-size: 10.5px; margin-top: 2px; }

.tv-center-cohoc .tv-center-title{
  font-size: 22px;
  font-weight: 800 !important;
  text-align:center;
  margin: 8px 0 10px;
}

/* info grid (cohoc) */
.tv-center-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
}
.tv-center-grid b{ font-weight: 900; }

/* legend (cohoc): không absolute để tránh chồng */
.tv-legend{
  position: static !important;
  margin-top: 10px;
  justify-content: center;
  display:flex;
  gap: 8px;
  font-size: 11px;
  font-weight: 900;
}
.tv-leg{ display:inline-flex; align-items:center; gap:6px; }
.tv-leg::before{
  content:"";
  width: 10px;
  height: 10px;
  border: 1px solid #222;
  display:inline-block;
}
.tv-kim::before{ background:#c0c0c0; }
.tv-moc::before{ background:#22c55e; }
.tv-thuy::before{ background:#3b82f6; }
.tv-hoa::before{ background:#ef4444; }
.tv-tho::before{ background:#f59e0b; }

/* dấu đỏ */
.tv-seal{
  position:absolute;
  right: 14px !important;
  bottom: 14px !important;
  width: 36px !important;
  height: 36px !important;
  border: 2px solid #b00000;
  background: linear-gradient(45deg, rgba(176,0,0,.15), rgba(176,0,0,.05));
  border-radius: 6px;
  opacity: .85;
}

/* đường chéo cohoc (đang tắt) */
.tv-center-lines-cohoc{ display:none !important; }

/* ===== Tag Tuần/Triệt (overlay) ===== */
.tv-board-wrap, .tv-board{ overflow: visible !important; }

.tv-tagline{
  position:absolute;
  z-index:999;
  left:50%;
  transform:translateX(-50%);
  top:-10px;
  padding:3px 12px;
  background:#111;
  color:#fff;
  font-weight:800;
  font-size:12px;
  line-height:1;
  border-radius:2px;
  white-space:nowrap;
  pointer-events:none;
  box-shadow: 0 1px 0 rgba(0,0,0,.35);
}
.tv-tagline.tv-tag-vertical{
  top: 50%;
  left: auto;
  right: -18px;
  transform: translateY(-50%) rotate(-90deg);
  transform-origin: center;
}

.tv-block-overlay{
  z-index: 9999;
  justify-self: center;
  align-self: start;
  transform: translateY(-50%);
  padding: 3px 12px;
  background:#111;
  color:#fff;
  font-weight:800;
  font-size:12px;
  line-height:1;
  border-radius:2px;
  white-space:nowrap;
  pointer-events:none;
}
.tv-block-overlay.tv-block-vertical{
  justify-self: start;
  align-self: center;
  transform: translateX(-50%);
}

/* ===== FONT chống lỗi dấu ===== */
#tv_chart, .tv-board, .tv-cell{
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, "Noto Sans", "Helvetica Neue", sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* =========================================================
   PRINT: chỉ in phần lá số
========================================================= */
@media print{
  .tuvilaso-form,
  .tv-toolbar,
  .tuvilaso-note,
  .tuvilaso-title{
    display:none !important;
  }
  .tuvilaso-card{
    border: none !important;
    box-shadow: none !important;
  }
  .tv-board-wrap{
    overflow: visible !important;
  }
  @page { size: A4 portrait; margin: 6mm; }

  .tuvilaso-wrap{ max-width:none; padding:0; }
  .tuvilaso-card{ padding:0; margin:0; }
  .tv-board{ min-width: 0 !important; }
}

.muted{ color: var(--tv-muted); }
.err{ color: #dc2626; font-weight: 800; }

/* =========================================================
   RESULT CARD UPGRADE (scoped)
========================================================= */
#tuvi-laso-app .tuvilaso-card{
  background: linear-gradient(180deg, #ffffff, #fbfbff);
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 16px;
  box-shadow: 0 18px 50px rgba(0,0,0,.08);
  padding: 14px 16px 18px;
  margin-top: 14px;
}

#tuvi-laso-app .tuvilaso-title{
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 10px;
  font-size: 15px;
  margin: 0 0 10px;
  font-weight: 900;
  letter-spacing: .2px;
}

#tuvi-laso-app #tv_status{
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(20,18,40,.04);
  border: 1px solid rgba(0,0,0,.06);
  margin-bottom: 10px;
}

#tuvi-laso-app .tv-meta-lite{
  display:flex;
  flex-wrap: wrap;
  gap: 8px 10px;
  font-size: 12px;
  line-height: 1.25;
}
#tuvi-laso-app .tv-meta-lite > div{
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.75);
  border: 1px solid rgba(0,0,0,.06);
  box-shadow: 0 6px 14px rgba(0,0,0,.06);
  white-space: nowrap;
}

#tuvi-laso-app .tv-toolbar{
  display:flex;
  align-items:center;
  gap: 10px;
  flex-wrap: wrap;
  margin: 10px 0 12px;
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(20,18,40,.04);
  border: 1px solid rgba(0,0,0,.06);
}

#tuvi-laso-app .tv-btn{
  border: 1px solid rgba(0,0,0,.10);
  background: #fff;
  border-radius: 12px;
  padding: 8px 10px;
  font-weight: 800;
  font-size: 12px;
  cursor: pointer;
  box-shadow: 0 10px 18px rgba(0,0,0,.06);
}
#tuvi-laso-app .tv-btn:hover{
  transform: translateY(-1px);
  box-shadow: 0 14px 24px rgba(0,0,0,.10);
}
#tuvi-laso-app .tv-toolbar-note{
  margin-left: auto;
  font-size: 12px;
  opacity: .75;
}

/* vùng chứa chart */
#tuvi-laso-app .tuvilaso-chart{ margin-top: 10px; }

/* wrap ngoài do JS tạo: #tv_board_wrap */
#tuvi-laso-app #tv_board_wrap{
  display:flex;
  justify-content:center;
  align-items:flex-start;
  width: 100%;
  overflow:auto;
  padding: 14px;
  border-radius: 18px;
  background:
    radial-gradient(900px 360px at 30% 20%, rgba(255,210,74,.12), transparent 60%),
    radial-gradient(800px 320px at 80% 70%, rgba(120,70,255,.10), transparent 60%),
    linear-gradient(180deg, rgba(20,18,40,.03), rgba(20,18,40,.01));
  border: 1px solid rgba(0,0,0,.06);
}

#tuvi-laso-app #tv_board_wrap .tv-board{
  margin: 0 auto;
  transform-origin: top center;
}

/* =========================================================
   LUẬN GIẢI — trạng thái cuối (giữ phần sau)
========================================================= */
#tuvi-laso-app .tv-interpret{
  margin-top: 16px;
  border-radius: 18px;
  border: 1px solid rgba(140,100,0,.18);
  background: #fff;
  box-shadow: 0 18px 46px rgba(0,0,0,.10);
  overflow: hidden;
}

#tuvi-laso-app .tv-i-grid{
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* card cung: viền bao quanh */
.tv-i-card{
  border:1px solid rgba(245,158,11,.35) !important;
  border-radius:16px !important;
  background:#fff !important;
  padding:16px 16px 14px !important;
  margin:16px 0 !important;
  box-shadow:0 6px 18px rgba(17,24,39,.06) !important;
}

/* tiêu đề cung */
.tv-i-card > h4{
  font-size:22px !important;
  font-weight:900 !important;
  margin:0 0 6px !important;
  line-height:1.2 !important;
}

/* mô tả nhỏ */
.tv-i-topic{
  font-size:14px !important;
  color:#6b7280 !important;
  margin:0 0 8px !important;
}

/* nội dung */
.tv-i-card p{
  margin:8px 0 0 !important;
  line-height:1.7 !important;
  font-size:15px !important;
}

/* tone badge (dạng đơn giản) */
.tv-i-tone{
  display:inline-block;
  margin-left:8px;
  font-size:12px !important;
  padding: 2px 10px !important;
  border-radius: 999px !important;
  background: transparent !important;
  border: 1px solid #e5e7eb !important;
  color:#374151 !important;
}

/* vòng điểm: gọn, ẩn caption */
.tv-score-wrap{
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  gap:6px !important;
  margin:8px 0 10px !important;
}
.tv-score{
  width:96px !important;
  height:96px !important;
  filter: drop-shadow(0 8px 18px rgba(0,0,0,.10));
}
.tv-score-bg{
  fill:#fff !important;
  stroke: rgba(17,24,39,.08) !important;
  stroke-width:10 !important;
}
.tv-score-fg{
  stroke: url(#tvGrad) !important;
  stroke-width:10 !important;
  stroke-linecap: round !important;
  transform: rotate(-90deg);
  transform-origin: 60px 60px;
}
.tv-score-num{
  font-size:22px !important;
  font-weight:900 !important;
  fill:#111827 !important;
}
.tv-score-unit{ display:none !important; }
.tv-score-caption{ display:none !important; }

/* HIỆN luận sao chính */
.tv-pack,
.tv-pack-block{
  display:block !important;
}

/* CHỈ ẨN sao phụ + note/action nếu bạn muốn */
.tv-pack-key,
.tv-pack-item,
.tv-i-note,
.tv-i-action{
  display:none !important;
}



/* xóa box hints theo sao */
.tv-i-card .tv-i-hints,
.tv-i-card .tv-i-hint{
  display:none !important;
}

/* bỏ vạch vàng bên trái ở tổng quan */
.tv-ov-title,
.tv-ov-item{
  border-left: 0 !important;
  padding-left: 0 !important;
}

/* bỏ vòng viền thừa quanh section tổng quan */
#tuvi-laso-app #tv_sec_overview.tv-i-section{
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 14px 0 0 !important;
}
#tuvi-laso-app #tv_sec_overview.tv-i-section .tv-i-section-head{
  display: none !important;
}
#tuvi-laso-app #tv_sec_overview.tv-i-section .tv-i-section-body{
  padding: 0 !important;
}

/* =========================================================
   FIX: TV Chart whitespace + overflow
========================================================= */
#tuvi-laso-app #tv_chart{
  padding: 0 !important;
  margin-top: 10px;
  min-height: 0 !important;
  height: auto !important;
  display: flex;
  justify-content: center;
  overflow: hidden;
}

#tuvi-laso-app #tv_chart .tv-chart-fit{
  transform-origin: top center;
  will-change: transform;
}

#tuvi-laso-app #tv_chart img,
#tuvi-laso-app #tv_chart canvas,
#tuvi-laso-app #tv_chart svg{
  max-width: 100%;
  height: auto;
}

#tuvi-laso-app #tv_chart > *{
  margin-bottom: 0 !important;
}

#tuvi-laso-app .tv-board-wrap{
  border-radius: 12px;
  background: #fff;
}
#tuvi-laso-app .tv-board{
  transform-origin: top left;
  will-change: transform;
}

@media (max-width: 680px){
  .tv-center-grid{ grid-template-columns: 1fr; }
}
/* =========================================================
   UI DARK GOLD (giống ảnh) — chỉ ảnh hưởng FORM + SECTION
   Không đụng .tv-board / .tv-cell / .tv-center (lá số)
========================================================= */

#tuvi-laso-app.tuvilaso-wrap{
  max-width: 1180px;
  margin: 22px auto;
  padding: 0 16px 40px;
}

#tuvi-laso-app .tv-hero{
  border-radius: 26px;
  overflow: hidden;
  background:
    radial-gradient(1200px 600px at 50% 0%, rgba(255,180,60,.18), rgba(0,0,0,0) 60%),
    linear-gradient(180deg, #0a1020, #060b16);
  border: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 30px 80px rgba(0,0,0,.45);
}

#tuvi-laso-app .tv-hero-inner{ padding: 26px; }

#tuvi-laso-app .tv-hero-top{
  display:flex;
  flex-direction: column;
  align-items:center;
  gap: 10px;
  margin-bottom: 18px;
  padding-bottom: 18px;
  border-bottom: 1px solid rgba(255,255,255,.06);
}

#tuvi-laso-app .tv-hero-title{
  margin: 0;
  font-weight: 950;
  font-size: 36px;
  line-height: 1.5;
  letter-spacing: .22em;
  text-transform: uppercase;
  background: linear-gradient(180deg, #ffe5a7, #f3b548 45%, #d98a24);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

#tuvi-laso-app .tv-hero-sub{
  display:block !important;
  margin-top: -4px;
  font-weight: 800;
  letter-spacing: .18em;
  text-transform: uppercase;
  font-size: 12px;
  color: rgba(210,220,245,.72);
}

/* badge icon giữa như ảnh: nếu bạn không cần thì ẩn */
#tuvi-laso-app .tv-badge{
  display:none !important;
}

/* khối form kiểu “kính mờ” */
#tuvi-laso-app .tv-glass{
  background: rgba(255,255,255,.02) !important;
  border: 1px solid rgba(255,255,255,.06) !important;
  border-radius: 22px !important;
  padding: 18px !important;
  backdrop-filter: blur(10px);
}

/* grid: name lớn + gender phải, date 1 hàng, giờ + nút 1 hàng */
#tuvi-laso-app .tv-form-grid{
  display:grid;
  grid-template-columns: 1.7fr 1fr;
  grid-template-areas:
    "name gender"
    "date date"
    "hour hour"
    "actions actions";
  gap: 16px 18px;
  align-items:end;
}

/* map theo thứ tự field như HTML bạn đang có */
#tuvi-laso-app .tv-form-grid .tv-field:nth-of-type(1){ grid-area: name; }
#tuvi-laso-app .tv-form-grid .tv-field:nth-of-type(2){ grid-area: date; }
#tuvi-laso-app .tv-form-grid .tv-field:nth-of-type(3){ grid-area: hour; }
#tuvi-laso-app .tv-form-grid .tv-field:nth-of-type(4){ grid-area: gender; }
#tuvi-laso-app .tv-actions{ grid-area: actions; }

@media (max-width: 860px){
  #tuvi-laso-app .tv-form-grid{
    grid-template-columns: 1fr;
    grid-template-areas:
      "name" "gender" "date" "hour" "actions";
  }
}

#tuvi-laso-app .tv-field label{
  display:flex;
  align-items:center;
  gap:8px;
  margin: 0 0 10px;
  color: rgba(255,190,80,.95);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .16em;
  text-transform: uppercase;
}

/* input/select */
#tuvi-laso-app .tv-input,
#tuvi-laso-app .tv-mini{
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 16px;
  overflow:hidden;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}

#tuvi-laso-app .tv-input .tv-ico{
  width: 54px;
  height: 54px;
  display:flex;
  align-items:center;
  justify-content:center;
  background: rgba(255,255,255,.03);
  color: rgba(255,210,140,.9);
  border-right: 1px solid rgba(255,255,255,.06);
}

#tuvi-laso-app .tv-input input,
#tuvi-laso-app .tv-input select,
#tuvi-laso-app .tv-mini select{
  width:100%;
  height: 54px;
  border:0;
  outline:none;
  background: transparent;
  padding: 0 16px;
  font-size: 15px;
  font-weight: 850;
  color: rgba(235,240,255,.92);
}

#tuvi-laso-app .tv-input:focus-within,
#tuvi-laso-app .tv-mini:focus-within{
  border-color: rgba(255,170,60,.55);
  box-shadow: 0 0 0 4px rgba(255,160,60,.12);
}

/* date row */
#tuvi-laso-app .tv-date-3{
  display:grid;
  grid-template-columns: 1fr 1fr 1.1fr;
  gap: 14px;
}

/* gender pill */
#tuvi-laso-app .tv-gender{
  display:flex;
  gap: 12px;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 16px;
  padding: 6px;
}

#tuvi-laso-app .tv-pill{
  flex:1;
  height: 46px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.03);
  color: rgba(230,235,255,.78);
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight: 950;
  cursor:pointer;
  position: relative;
}

#tuvi-laso-app .tv-pill input{
  position:absolute;
  opacity:0;
  pointer-events:none;
}

#tuvi-laso-app .tv-pill:has(input:checked){
  background: linear-gradient(180deg, #f0a528, #d67e0d);
  border-color: rgba(0,0,0,.35);
  color: #121522;
  box-shadow: 0 10px 22px rgba(214,126,13,.25);
}

/* CTA button */
#tuvi-laso-app .tuvilaso-btn{
  width:100%;
  height: 64px;
  border:0;
  border-radius: 18px;
  cursor:pointer;
  font-weight: 950;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #141726;
  background: linear-gradient(180deg, #ffb84a, #d67e0d);
  box-shadow: 0 16px 34px rgba(214,126,13,.26);
}
#tuvi-laso-app .tuvilaso-btn:hover{ filter: brightness(1.03); }
#tuvi-laso-app .tuvilaso-btn:active{ transform: translateY(1px); }

/* RESULT card + status */
#tuvi-laso-app .tuvilaso-card{
  margin-top: 18px;
  border-radius: 22px;
  background: linear-gradient(180deg, rgba(10,16,32,.92), rgba(6,11,22,.92));
  border: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 30px 80px rgba(0,0,0,.35);
  padding: 16px 16px 20px;
}

#tuvi-laso-app .tuvilaso-title{
  font-weight: 950;
  text-transform: uppercase;
  letter-spacing: .18em;
  color: rgba(255,190,80,.95);
  padding: 8px 10px 14px;
  border-bottom: 1px solid rgba(255,255,255,.06);
  margin-bottom: 10px;
}

/* Export PDF */
#tuvi-laso-app .tv-export-bar{
  display:flex;
  justify-content:flex-end;
  padding: 0 10px 10px;
}
#tuvi-laso-app .tv-export-btn{
  height: 40px;
  padding: 0 14px;
  border-radius: 12px;
  cursor: pointer;
  font-weight: 950;
  letter-spacing: .08em;
  text-transform: uppercase;
  background: rgba(255,184,74,.10);
  border: 1px solid rgba(255,184,74,.45);
  color: rgba(255,220,150,.95);
}
#tuvi-laso-app .tv-export-btn:hover{ filter: brightness(1.08); }
#tuvi-laso-app .tv-export-btn:active{ transform: translateY(1px); }

#tuvi-laso-app .tuvilaso-status{
  border-radius: 16px;
  padding: 12px 14px;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.08);
  color: rgba(235,240,255,.86);
}
#tuvi-laso-app .tuvilaso-status.is-error{ color: #ffb4b4; }

/* --- interpret: làm giống ảnh dạng section --- */
#tuvi-laso-app #tv_interpret{
  margin-top: 18px;
  border-radius: 22px;
  background: linear-gradient(180deg, rgba(10,16,32,.92), rgba(6,11,22,.92));
  border: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 30px 80px rgba(0,0,0,.35);
  padding: 18px;
}

#tuvi-laso-app .tv-i-card{
  border-radius: 18px;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.08);
  padding: 16px;
  margin: 12px 0;
}

#tuvi-laso-app .tv-i-card h4{
  margin: 0 0 10px;
  color: rgba(255,190,80,.95);
  font-weight: 950;
  letter-spacing: .10em;
  text-transform: uppercase;
  font-size: 13px;
}
#tuvi-laso-app .tv-i-card p{
  margin: 0;
  color: rgba(235,240,255,.86);
  line-height: 1.7;
  font-size: 15px;
}

#tuvi-laso-app .tv-hidden{ display:none !important; }
/* =========================================================
   INTERPRET UI — DARK GOLD (giống 3 ảnh)
   Chỉ tác động phần luận giải (#tv_interpret), KHÔNG đụng lá số.
========================================================= */

#tuvi-laso-app #tv_interpret{
  display:block !important;
  margin-top: 18px;
  border-radius: 26px;
  background: linear-gradient(180deg, rgba(10,16,32,.94), rgba(6,11,22,.94));
  border: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 30px 80px rgba(0,0,0,.35);
  padding: 22px 18px;
  overflow: hidden;
}

/* ===== Section wrapper ===== */
#tuvi-laso-app #tv_interpret .tv-i-section{
  border: 1px solid rgba(255,255,255,.06) !important;
  border-radius: 24px !important;
  background: rgba(255,255,255,.02) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
  padding: 18px !important;
  margin: 16px 0 !important;
}

/* ===== Section header: chữ vàng, căn giữa, có line vàng ===== */
#tuvi-laso-app #tv_interpret .tv-i-section-head{
  display:flex !important;              /* bẻ mọi rule ẩn head */
  justify-content:center !important;
  align-items:center !important;
  padding: 6px 0 16px !important;
  margin: 0 0 14px !important;
  position: relative !important;
  border: 0 !important;
  background: transparent !important;
}

#tuvi-laso-app #tv_interpret .tv-i-section-head::after{
  content:"";
  position:absolute;
  left: 18%;
  right: 18%;
  bottom: 6px;
  height: 3px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(0,0,0,0), rgba(255,184,74,.75), rgba(0,0,0,0));
  opacity: .9;
}

/* Tên section (h2/h3/div đều ổn) */
#tuvi-laso-app #tv_interpret .tv-i-section-head > *{
  margin:0 !important;
  font-weight: 950 !important;
  letter-spacing: .20em !important;
  text-transform: uppercase !important;
  font-size: 14px !important;
  color: rgba(255,190,80,.95) !important;
}

/* =========================================================
   TỔNG QUAN — 3 card chỉ số trên + 1 box “LỜI GIẢI TÓM LƯỢC”
   (mình viết linh hoạt theo nhiều class hay gặp)
========================================================= */

/* Grid 3 thẻ (nếu HTML có các wrapper kiểu grid/row) */
#tuvi-laso-app #tv_sec_overview :is(.tv-ov-grid,.tv-ov-cards,.tv-ov-row,.tv-ov-metrics){
  display:grid !important;
  grid-template-columns: repeat(3, minmax(0,1fr)) !important;
  gap: 16px !important;
  margin: 12px 0 18px !important;
}

@media (max-width: 920px){
  #tuvi-laso-app #tv_sec_overview :is(.tv-ov-grid,.tv-ov-cards,.tv-ov-row,.tv-ov-metrics){
    grid-template-columns: 1fr !important;
  }
}

/* Mỗi thẻ metric */
#tuvi-laso-app #tv_sec_overview :is(.tv-ov-grid,.tv-ov-cards,.tv-ov-row,.tv-ov-metrics) > *{
  border-radius: 18px !important;
  background: rgba(255,255,255,.03) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  padding: 16px !important;
  display:flex !important;
  align-items:center !important;
  gap: 14px !important;
}

/* Icon box (nếu có) */
#tuvi-laso-app #tv_sec_overview :is(.tv-ov-ico,.tv-ov-icon,.tv-ov-badge,.tv-ov-metrics-ico) {
  width: 44px;
  height: 44px;
  border-radius: 14px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.08);
  display:flex;
  align-items:center;
  justify-content:center;
  color: rgba(210,220,245,.88);
}

/* Text trong metric card: dòng nhỏ + dòng lớn */
#tuvi-laso-app #tv_sec_overview :is(.tv-ov-grid,.tv-ov-cards,.tv-ov-row,.tv-ov-metrics) *{
  color: rgba(235,240,255,.86);
}
#tuvi-laso-app #tv_sec_overview :is(.tv-ov-label,.tv-ov-k,.tv-ov-small){
  font-size: 11px !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
  opacity: .78 !important;
  font-weight: 900 !important;
}
#tuvi-laso-app #tv_sec_overview :is(.tv-ov-val,.tv-ov-v,.tv-ov-big){
  font-size: 18px !important;
  font-weight: 950 !important;
  margin-top: 2px !important;
}

/* Box “LỜI GIẢI TÓM LƯỢC” theo cấu trúc hay gặp: .tv-ov-title + .tv-ov-item */
#tuvi-laso-app #tv_sec_overview .tv-ov-title{
  margin-top: 10px !important;
  color: rgba(255,190,80,.95) !important;
  font-weight: 950 !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
  font-size: 14px !important;
}

#tuvi-laso-app #tv_sec_overview .tv-ov-item{
  margin-top: 12px !important;
  border-radius: 22px !important;
  background: rgba(255,255,255,.03) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  padding: 18px 18px 16px !important;
  color: rgba(235,240,255,.86) !important;
  line-height: 1.75 !important;
  font-size: 15px !important;
}

/* Nếu summary là 1 block khác class */
#tuvi-laso-app #tv_sec_overview :is(.tv-ov-summary,.tv-ov-box,.tv-ov-panel,.tv-ov-brief){
  margin-top: 12px !important;
  border-radius: 22px !important;
  background: rgba(255,255,255,.03) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  padding: 18px !important;
  color: rgba(235,240,255,.86) !important;
  line-height: 1.75 !important;
}

/* =========================================================
   GIẢI LUẬN CUNG — danh sách có số thứ tự + panel phải “trống”
   Làm bằng CSS counter + pseudo-element, không cần sửa HTML.
========================================================= */

/* cố đoán ID section: tv_sec_palaces / tv_sec_cung / tv_sec_palace */
#tuvi-laso-app :is(#tv_sec_palaces,#tv_sec_cung,#tv_sec_palace) .tv-i-section-body{
  counter-reset: tvpal;
}

/* Card cung */
#tuvi-laso-app :is(#tv_sec_palaces,#tv_sec_cung,#tv_sec_palace) .tv-i-card{
  counter-increment: tvpal;
  position: relative !important;
  border-radius: 22px !important;
  background: rgba(255,255,255,.03) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  box-shadow: 0 16px 40px rgba(0,0,0,.22) !important;

  /* chừa chỗ bên phải để giả lập panel trống */
  padding: 16px calc(56% + 18px) 16px 18px !important;
  overflow: hidden !important;
  margin: 14px 0 !important;
}

/* Panel trống bên phải */
#tuvi-laso-app :is(#tv_sec_palaces,#tv_sec_cung,#tv_sec_palace) .tv-i-card::after{
  content:"";
  position:absolute;
  top: 12px;
  right: 12px;
  bottom: 12px;
  width: 56%;
  border-radius: 18px;
  background: rgba(0,0,0,.38);
  border: 1px solid rgba(255,255,255,.08);
}

/* Số thứ tự bên trái giống ảnh */
#tuvi-laso-app :is(#tv_sec_palaces,#tv_sec_cung,#tv_sec_palace) .tv-i-card::before{
  content: counter(tvpal);
  position:absolute;
  left: 18px;
  top: 16px;
  width: 28px;
  height: 28px;
  border-radius: 9px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight: 950;
  font-size: 12px;
  color: #141726;
  background: linear-gradient(180deg, #ffb84a, #d67e0d);
  box-shadow: 0 10px 20px rgba(214,126,13,.25);
  z-index: 3;
}

/* Title cung: to hơn + trắng, không quá “tiny” */
#tuvi-laso-app :is(#tv_sec_palaces,#tv_sec_cung,#tv_sec_palace) .tv-i-card > h4{
  margin: 0 0 8px !important;
  padding-left: 40px !important; /* chừa số */
  font-size: 18px !important;
  font-weight: 950 !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
  color: rgba(235,240,255,.92) !important;
}

/* Dòng mô tả nhỏ (nếu có) */
#tuvi-laso-app :is(#tv_sec_palaces,#tv_sec_cung,#tv_sec_palace) .tv-i-topic{
  margin: 0 0 10px !important;
  padding-left: 40px !important;
  color: rgba(210,220,245,.70) !important;
  font-weight: 800 !important;
  font-style: italic !important;
  font-size: 13px !important;
}

/* Nội dung: italic nhẹ + có vạch vàng bên trái như ảnh */
#tuvi-laso-app :is(#tv_sec_palaces,#tv_sec_cung,#tv_sec_palace) .tv-i-card p{
  margin: 0 !important;
  padding-left: 54px !important;
  color: rgba(235,240,255,.86) !important;
  line-height: 1.7 !important;
  font-size: 14.5px !important;
  font-style: italic !important;
  position: relative !important;
}

#tuvi-laso-app :is(#tv_sec_palaces,#tv_sec_cung,#tv_sec_palace) .tv-i-card p::before{
  content:"";
  position:absolute;
  left: 40px;
  top: .25em;
  bottom: .25em;
  width: 2px;
  border-radius: 2px;
  background: linear-gradient(180deg, rgba(255,184,74,.0), rgba(255,184,74,.85), rgba(255,184,74,.0));
  opacity: .95;
}

/* Mobile: bỏ panel trống để đỡ chiếm chỗ */
@media (max-width: 860px){
  #tuvi-laso-app :is(#tv_sec_palaces,#tv_sec_cung,#tv_sec_palace) .tv-i-card{
    padding: 16px 16px 16px 16px !important;
  }
  #tuvi-laso-app :is(#tv_sec_palaces,#tv_sec_cung,#tv_sec_palace) .tv-i-card::after{
    display:none !important;
  }
  #tuvi-laso-app :is(#tv_sec_palaces,#tv_sec_cung,#tv_sec_palace) .tv-i-card > h4,
  #tuvi-laso-app :is(#tv_sec_palaces,#tv_sec_cung,#tv_sec_palace) .tv-i-topic,
  #tuvi-laso-app :is(#tv_sec_palaces,#tv_sec_cung,#tv_sec_palace) .tv-i-card p{
    padding-left: 46px !important;
  }
}

/* =========================================================
   Chắc chắn không bị CSS cũ “ẩn” section-head nữa
========================================================= */
#tuvi-laso-app #tv_sec_overview.tv-i-section .tv-i-section-head,
#tuvi-laso-app :is(#tv_sec_palaces,#tv_sec_cung,#tv_sec_palace).tv-i-section .tv-i-section-head{
  display:flex !important;
}
/* =========================================================
   FIX: BỎ PANEL ĐEN BÊN PHẢI + FULL WIDTH TEXT
========================================================= */

/* Nếu trước đó bạn tạo panel đen bằng ::after thì tắt nó */
#tuvi-laso-app :is(#tv_sec_palaces,#tv_sec_cung,#tv_sec_palace) .tv-i-card::after{
  display:none !important;
  content:none !important;
}

/* Trả padding về bình thường để chữ chạy full */
#tuvi-laso-app :is(#tv_sec_palaces,#tv_sec_cung,#tv_sec_palace) .tv-i-card{
  padding: 16px 18px !important; /* full width */
}

/* Title/Topic/Paragraph không cần chừa bên phải nữa */
#tuvi-laso-app :is(#tv_sec_palaces,#tv_sec_cung,#tv_sec_palace) .tv-i-card > h4,
#tuvi-laso-app :is(#tv_sec_palaces,#tv_sec_cung,#tv_sec_palace) .tv-i-topic,
#tuvi-laso-app :is(#tv_sec_palaces,#tv_sec_cung,#tv_sec_palace) .tv-i-card p{
  padding-right: 0 !important;
}

/* Nếu bạn còn dùng vạch vàng + thụt lề theo mẫu, giữ lại vừa đủ */
#tuvi-laso-app :is(#tv_sec_palaces,#tv_sec_cung,#tv_sec_palace) .tv-i-card > h4{
  padding-left: 40px !important;
}
#tuvi-laso-app :is(#tv_sec_palaces,#tv_sec_cung,#tv_sec_palace) .tv-i-topic{
  padding-left: 40px !important;
}
#tuvi-laso-app :is(#tv_sec_palaces,#tv_sec_cung,#tv_sec_palace) .tv-i-card p{
  padding-left: 54px !important;
}

/* =========================================================
   NÚT MỞ LUẬN GIẢI (màu đỏ, dễ nhìn)
   Bạn sẽ gắn class .tv-unlock-btn vào nút/element "MỞ LUẬN GIẢI"
========================================================= */

#tuvi-laso-app .tv-unlock-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding: 12px 16px;
  border-radius: 14px;
  border: 1px solid rgba(0,0,0,.28);
  background: linear-gradient(180deg, #ff3b3b, #cc1f1f);
  color: #fff !important;
  font-weight: 950;
  letter-spacing: .08em;
  text-transform: uppercase;
  cursor:pointer;
  user-select:none;
  box-shadow: 0 14px 26px rgba(255,45,45,.22);
}
#tuvi-laso-app .tv-unlock-btn:hover{ filter: brightness(1.03); }
#tuvi-laso-app .tv-unlock-btn:active{ transform: translateY(1px); }

/* Nếu “MỞ LUẬN GIẢI” đang là <a> hoặc <div> */
#tuvi-laso-app .tv-unlock-btn:link,
#tuvi-laso-app .tv-unlock-btn:visited{ color:#fff !important; text-decoration:none !important; }

/* =========================================================
   POPUP UI (chưa có logic mã/chuyển khoản — chỉ khung sẵn)
========================================================= */

#tuvi-laso-app .tv-unlock-modal{
  position: fixed;
  inset: 0;
  display:none;
  z-index: 999999;
}
#tuvi-laso-app .tv-unlock-modal.is-open{ display:block; }

#tuvi-laso-app .tv-unlock-ovl{
  position:absolute;
  inset:0;
  background: rgba(0,0,0,.60);
  backdrop-filter: blur(2px);
}

#tuvi-laso-app .tv-unlock-box{
  position:absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
  width: min(520px, 92vw);
  background: linear-gradient(180deg, rgba(10,16,32,.96), rgba(6,11,22,.96));
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 20px;
  box-shadow: 0 30px 80px rgba(0,0,0,.55);
  padding: 16px;
  color: rgba(235,240,255,.90);
}

#tuvi-laso-app .tv-unlock-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 10px;
  padding: 6px 6px 12px;
  border-bottom: 1px solid rgba(255,255,255,.08);
  margin-bottom: 12px;
}
#tuvi-laso-app .tv-unlock-title{
  margin:0;
  font-weight: 950;
  letter-spacing: .12em;
  text-transform: uppercase;
  font-size: 13px;
  color: rgba(255,190,80,.95);
}
#tuvi-laso-app .tv-unlock-x{
  width: 38px;
  height: 38px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.04);
  color: rgba(235,240,255,.92);
  font-size: 20px;
  font-weight: 900;
  cursor:pointer;
}

#tuvi-laso-app .tv-unlock-body{
  padding: 6px;
  line-height: 1.6;
  font-size: 14px;
}
#tuvi-laso-app .tv-unlock-body b{ font-weight: 950; }

#tuvi-laso-app .tv-unlock-row{
  margin-top: 12px;
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
}

#tuvi-laso-app .tv-unlock-input{
  flex: 1;
  min-width: 220px;
  height: 46px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.04);
  color: rgba(235,240,255,.92);
  padding: 0 14px;
  outline: none;
  font-weight: 800;
}
#tuvi-laso-app .tv-unlock-input::placeholder{ color: rgba(210,220,245,.55); }

#tuvi-laso-app .tv-unlock-cta{
  height: 46px;
  padding: 0 14px;
  border-radius: 14px;
  border: 1px solid rgba(0,0,0,.35);
  background: linear-gradient(180deg, #ffb84a, #d67e0d);
  color: #141726;
  font-weight: 950;
  cursor:pointer;
  letter-spacing: .08em;
  text-transform: uppercase;
}
/* =========================================================
   1) BỎ ICON trong ô Họ tên + Giờ sinh -> ô bớt “to”
========================================================= */

/* Ẩn icon trong input/select (2 ô bạn khoanh đỏ) */
#tuvi-laso-app .tv-input .tv-ico{
  display:none !important;
}

/* Vì mất icon, chỉnh lại padding/height cho input/select trong tv-input */
#tuvi-laso-app .tv-input{
  border-radius: 16px; /* giữ style */
}

#tuvi-laso-app .tv-input input,
#tuvi-laso-app .tv-input select{
  height: 46px !important;      /* giảm từ 54 xuống 46 */
  padding: 0 14px !important;   /* bỏ chừa chỗ icon */
  font-size: 14px !important;
}

/* Nếu bạn muốn đồng bộ luôn các select nhỏ (ngày/tháng/năm) cho gọn */
#tuvi-laso-app .tv-mini select{
  height: 46px !important;
  padding: 0 14px !important;
  font-size: 14px !important;
}

/* =========================================================
   2) Dropdown ngày/tháng/năm: chữ trắng -> chữ đen
   (áp cho danh sách xổ xuống + giá trị đang chọn)
========================================================= */

/* Giá trị hiển thị trong select (khi chưa xổ) */
#tuvi-laso-app .tv-mini select{
  color: #111 !important;                 /* chữ đen */
  background: rgba(255,255,255,.92) !important;  /* nền sáng */
}

/* Danh sách xổ xuống (option) */
#tuvi-laso-app .tv-mini select option{
  color: #111 !important;   /* chữ đen */
  background: #fff !important;
}

/* Một số trình duyệt cần ép thêm khi focus */
#tuvi-laso-app .tv-mini select:focus{
  color: #111 !important;
  background: rgba(255,255,255,.98) !important;
}
/* =========================================================
   FIX: Ngày/Tháng/Năm giữ nền tối + chữ trắng
   nhưng dropdown option khi xổ: nền trắng + chữ đen
========================================================= */

/* 1) Trạng thái bình thường: select nền tối + chữ sáng */
#tuvi-laso-app .tv-mini{
  background: rgba(255,255,255,.04) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
}

#tuvi-laso-app .tv-mini select{
  background: transparent !important;
  color: rgba(235,240,255,.92) !important;
}

/* placeholder (nếu browser dùng) */
#tuvi-laso-app .tv-mini select:invalid{
  color: rgba(235,240,255,.65) !important;
}

/* 2) Khi xổ dropdown: option nền trắng + chữ đen */
#tuvi-laso-app .tv-mini select option{
  background: #fff !important;
  color: #111 !important;
}

/* 3) Giữ focus không đổi theme (vẫn tối) */
#tuvi-laso-app .tv-mini select:focus{
  background: transparent !important;
  color: rgba(235,240,255,.92) !important;
}
/* =========================================
   FIX: Dropdown giờ sinh (#tv_h) chữ đen khi xổ
   - Input (đang chọn): nền tối chữ sáng
   - Danh sách option xổ: nền trắng chữ đen
========================================= */

/* Trạng thái bình thường (đang chọn) */
#tuvi-laso-app #tv_h{
  color: rgba(235,240,255,.92) !important;
  background: transparent !important;
}

/* Khi dropdown list được render (đa số browser sẽ dùng màu của option) */
#tuvi-laso-app #tv_h option{
  color: #111 !important;         /* chữ đen */
  background: #fff !important;    /* nền trắng */
}

/* Nếu có optgroup (phòng trường hợp sau này) */
#tuvi-laso-app #tv_h optgroup{
  color: #111 !important;
  background: #fff !important;
}

/* Firefox đôi khi cần set riêng cho select khi focus/open */
@-moz-document url-prefix(){
  #tuvi-laso-app #tv_h{
    background-color: rgba(255,255,255,.04) !important;
  }
  #tuvi-laso-app #tv_h option{
    background-color: #fff !important;
    color: #111 !important;
  }
}
/* =========================================================
   FIX: Đưa hàng đáy (ĐV | Trường Sinh | LN) xuống sát đáy ô cung
========================================================= */

/* 1) Tăng khoảng trống đáy để chữ không đè lên sao phụ */
#tuvi-laso-app .tv-cell{
  padding-bottom: 34px !important; /* bạn có thể tăng 36~40 nếu sao phụ nhiều */
}

/* 2) Ghim hàng đáy xuống dưới cùng */
#tuvi-laso-app .tv-bottom-row{
  position: absolute !important;
  left: 10px;
  right: 10px;
  bottom: 6px;              /* sát đáy - chỉnh 4~8px tùy mắt */
  margin-top: 0 !important; /* bỏ margin cũ */
  font-size: 13px;
  line-height: 1.1;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap: 10px;
  pointer-events: none;     /* tránh che click ô cung nếu bạn có click mở popup */
}

/* 3) Giữ 3 cột đúng vị trí như mẫu */
#tuvi-laso-app .tv-bottom-left{  width: 33%; text-align:left; }
#tuvi-laso-app .tv-bottom-mid{   width: 34%; text-align:center; font-weight:700; }
#tuvi-laso-app .tv-bottom-right{ width: 33%; text-align:right; }
/* =========================================================
   FIX UI: Tổng quan lá số
   - Bỏ vòng bao thừa (outer frame)
   - Title vàng + gạch chân giống "Luận các cung..."
========================================================= */

/* 1) BỎ "VÒNG BAO" THỪA quanh block tổng quan (outer wrapper) */
/* Các selector này cover nhiều trường hợp JS hay render */
#tuvi-laso-app .tv-interpret-body > .tv-i-section,
#tuvi-laso-app .tv-interpret-body > .tv-i-card,
#tuvi-laso-app .tv-interpret-body > .tv-ov,
#tuvi-laso-app .tv-interpret-body > section,
#tuvi-laso-app .tv-interpret-body > div{
  /* chỉ bỏ nếu nó chính là lớp bọc ngoài cùng gây vòng thừa */
  box-shadow: none;
}

/* Trường hợp outer frame có border + nền khác */
#tuvi-laso-app .tv-interpret-body > .tv-i-section,
#tuvi-laso-app .tv-interpret-body > .tv-ov{
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 0 14px 0 !important;
}

/* 2) TITLE "Tổng quan lá số của bạn" -> vàng + gạch chân như "Luận các cung..." */
/* Bắt theo nhiều khả năng: h3/h4/div có text */
#tuvi-laso-app .tv-interpret-body h3,
#tuvi-laso-app .tv-interpret-body h4{
  /* không áp đại trà tất cả h3/h4, chỉ áp mạnh khi là tiêu đề tổng quan */
}

/* Nếu tiêu đề tổng quan là h3/h4 và đứng trước các box tổng quan */
#tuvi-laso-app .tv-interpret-body h3:first-of-type,
#tuvi-laso-app .tv-interpret-body h4:first-of-type{
  color: rgba(255,190,80,.95) !important;
  font-weight: 950 !important;
  text-transform: uppercase !important;
  letter-spacing: .12em !important;
  font-size: 14px !important;
  margin: 0 0 12px !important;
  padding: 8px 10px 14px !important;
  border-bottom: 1px solid rgba(255,190,80,.35) !important; /* gạch chân vàng */
}

/* Fallback: nếu tiêu đề tổng quan là div/span có class "tv-ov-title" */
#tuvi-laso-app .tv-ov-title{
  color: rgba(255,190,80,.95) !important;
  font-weight: 950 !important;
  text-transform: uppercase !important;
  letter-spacing: .12em !important;
  font-size: 14px !important;
  margin: 0 0 12px !important;
  padding: 8px 10px 14px !important;
  border-bottom: 1px solid rgba(255,190,80,.35) !important;
  border-left: 0 !important;       /* bạn đã bỏ vạch trái rồi, giữ luôn */
}

/* 3) Các box con của tổng quan: giữ dạng card như hiện tại nhưng không có frame ngoài */
#tuvi-laso-app .tv-interpret-body .tv-i-card{
  margin-top: 12px !important;
}
/* =========================
   OVERVIEW TITLE: vàng + gạch chân như "Luận các cung"
========================= */
.tv-ov-wrap{
  padding: 6px 6px 0;
}

.tv-ov-h{
  margin: 0 0 10px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #f5b24a;              /* vàng */
  position: relative;
  padding-bottom: 10px;
}

.tv-ov-h:after{
  content:"";
  position:absolute;
  left:0;
  bottom:0;
  width: 240px;               /* độ dài gạch */
  height: 2px;
  background: rgba(245,178,74,.95);
  border-radius: 2px;
  box-shadow: 0 0 18px rgba(245,178,74,.30);
}

.tv-ov-sub{
  margin: 0 0 12px;
  color: rgba(255,255,255,.72);
  line-height: 1.6;
}
/* =========================================================
   FIX CHỮ ĐEN TRONG PHẦN LUẬN GIẢI (DARK)
   - Ép tất cả text mặc định trong #tv_interpret sáng lên
   - Riêng heading vàng đã có thì vẫn giữ vàng
========================================================= */
#tuvi-laso-app #tv_interpret{
  color: rgba(235,240,255,.88) !important; /* mọi text chưa set màu sẽ ăn trắng */
}

/* Các text kiểu "Luận giải tổng quan về Cung ..." thường là div/span/strong -> ép trắng */
#tuvi-laso-app #tv_interpret :is(
  .tv-ov-h, .tv-ov-title, .tv-ov-head, .tv-ov-label,
  .tv-overview-title, .tv-palace-overview-title,
  h5, h6, strong
){
  color: rgba(235,240,255,.92) !important;
}

/* Nếu có link trong khối này đang bị màu đen */
#tuvi-laso-app #tv_interpret a{
  color: rgba(255,220,150,.95) !important;
  text-decoration: none;
}
#tuvi-laso-app #tv_interpret a:hover{
  text-decoration: underline;
}

/* =========================================================
   "MỞ LUẬN GIẢI" — thường là nút hoặc summary (details)
   -> biến thành CTA nổi bật, dễ bấm
========================================================= */

/* Trường hợp 1: dùng <details><summary>...</summary></details> */
#tuvi-laso-app #tv_interpret details > summary{
  list-style: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 14px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.14);
  background: linear-gradient(180deg, #ffb84a, #d67e0d);
  color: #141726 !important;
  font-weight: 950;
  letter-spacing: .10em;
  text-transform: uppercase;
  box-shadow: 0 14px 28px rgba(214,126,13,.22);
}
#tuvi-laso-app #tv_interpret details > summary::-webkit-details-marker{ display:none; }
#tuvi-laso-app #tv_interpret details > summary:hover{ filter: brightness(1.03); }
#tuvi-laso-app #tv_interpret details > summary:active{ transform: translateY(1px); }

/* Trường hợp 2: là button/a/div toggle (không dùng details) */
#tuvi-laso-app #tv_interpret :is(button, a, [role="button"]).tv-unlock,
#tuvi-laso-app #tv_interpret :is(button, a, [role="button"]).tv-open,
#tuvi-laso-app #tv_interpret :is(button, a, [role="button"]).tv-toggle{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 14px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.14);
  background: linear-gradient(180deg, #ff3b3b, #cc1f1f);
  color: #fff !important;
  font-weight: 950;
  letter-spacing: .10em;
  text-transform: uppercase;
  box-shadow: 0 14px 28px rgba(255,45,45,.18);
  text-decoration: none !important;
}
#tuvi-laso-app #tv_interpret :is(button, a, [role="button"]).tv-unlock:hover,
#tuvi-laso-app #tv_interpret :is(button, a, [role="button"]).tv-open:hover,
#tuvi-laso-app #tv_interpret :is(button, a, [role="button"]).tv-toggle:hover{
  filter: brightness(1.03);
}


/* =========================
   UNLOCK MODAL (GLOBAL)
========================= */
.tvUnlockModal{position:fixed;inset:0;display:none;z-index:99999}
.tvUnlockModal.is-open{display:block}
.tvUnlockModal .tvum-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.55)}
.tvUnlockModal .tvum-card{position:relative;max-width:780px;margin:8vh auto 0;background:#111;border:1px solid rgba(255,255,255,.12);border-radius:14px;box-shadow:0 18px 60px rgba(0,0,0,.55);color:#fff;overflow:hidden}
.tvUnlockModal .tvum-head{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;background:linear-gradient(135deg, rgba(255,215,0,.22), rgba(255,215,0,.06))}
.tvUnlockModal .tvum-title{font-weight:800;font-size:16px}
.tvUnlockModal .tvum-close{background:transparent;border:0;color:#fff;font-size:18px;cursor:pointer;opacity:.85}
.tvUnlockModal .tvum-close:hover{opacity:1}
.tvUnlockModal .tvum-body{padding:16px}
.tvUnlockModal .tvum-sub{opacity:.88;margin-bottom:10px}
.tvUnlockModal .tvum-input{width:100%;padding:12px 12px;border-radius:10px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.06);color:#fff;outline:none}
.tvUnlockModal .tvum-input:focus{border-color:rgba(255,215,0,.75);box-shadow:0 0 0 3px rgba(255,215,0,.18)}
.tvUnlockModal .tvum-row{display:flex;gap:10px;margin-top:12px}
.tvUnlockModal .tvum-btn{flex:1;padding:10px 12px;border-radius:10px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.08);color:#fff;cursor:pointer}
.tvUnlockModal .tvum-btn:hover{background:rgba(255,255,255,.12)}
.tvUnlockModal .tvum-ok{border-color:rgba(255,215,0,.5);background:rgba(255,215,0,.15)}
.tvUnlockModal .tvum-ok:hover{background:rgba(255,215,0,.22)}
.tvUnlockModal .tvum-msg{margin-top:10px;color:#ffd766;min-height:20px}
/* ===== FLASH SALE (trong popup unlock) ===== */
.tvUnlockModal .tvum-flash {
  margin-top: 12px;
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid rgba(255, 215, 0, .18);
  background: rgba(255, 255, 255, .03)
}

.tvUnlockModal .tvum-flash-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 12px;
  background: linear-gradient(90deg, rgba(255, 184, 74, .95), rgba(214, 126, 13, .85));
  color: #141726;
  font-weight: 950;
  text-transform: uppercase
}

.tvUnlockModal .tvum-flash-badge {
  letter-spacing: .08em;
  font-size: 13px;
  white-space: nowrap
}

.tvUnlockModal .tvum-flash-timer {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 950;
  opacity: .95;
  white-space: nowrap
}

.tvUnlockModal .tvum-clock {
  display: inline-flex;
  align-items: center;
  gap: 6px
}

.tvUnlockModal .tvum-t {
  display: inline-block;
  min-width: 28px;
  text-align: center;
  padding: 4px 6px;
  border-radius: 8px;
  background: #fff;
  color: #111;
  font-weight: 950
}

.tvUnlockModal .tvum-flash-bot {
  display: flex;
  align-items: baseline;
  gap: 14px;
  padding: 12px;
  background: rgba(255, 255, 255, .04);
  color: #fff;
  flex-wrap: wrap
}

.tvUnlockModal .tvum-old {
  text-decoration: line-through;
  opacity: .72;
  font-weight: 800
}

.tvUnlockModal .tvum-new {
  font-size: 22px;
  font-weight: 950;
  color: #ffb84a
}

.tvUnlockModal .tvum-off {
  padding: 6px 10px;
  border-radius: 10px;
  background: rgba(255, 59, 59, .18);
  border: 1px solid rgba(255, 59, 59, .35);
  color: #ffb4b4;
  font-weight: 950
}

.tvUnlockModal .tvum-flash.is-ended .tvum-off {
  opacity: .55
}

@media (max-width:560px) {
  .tvUnlockModal .tvum-flash-top {
    flex-wrap: wrap
  }

  .tvUnlockModal .tvum-new {
    font-size: 20px
  }
}
/* Nội dung hướng dẫn lấy mã (render từ shortcode [codequota]) */
.tvUnlockModal .tvum-help{margin-top:12px;padding-top:12px;border-top:1px dashed rgba(255,255,255,.14);max-height:42vh;overflow:auto}

/* Container ẩn để JS lấy HTML shortcode */
#tuvi-laso-app ~ .tv-codequota-embed,
.tv-codequota-embed,
#tuvi-laso-app ~ .tv-fixunlock-embed,
.tv-fixunlock-embed{display:none !important}

/* Make locked body look decent when AI loading */
.tv-lock-body em{opacity:.85}


/* ===== Locked boxes (unlock by modal) ===== */
#tuvi-laso-app .tv-lock{
  margin-top:12px;
  padding:12px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:16px;
  background:rgba(255,255,255,.04);
}
#tuvi-laso-app .tv-lock-hint{font-size:13.5px;line-height:1.55;color:rgba(255,255,255,.85);margin-bottom:10px}
#tuvi-laso-app .tv-lock-form{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
#tuvi-laso-app .tv-lock-btn{height:40px;padding:0 14px;border-radius:12px;border:1px solid rgba(255,215,0,.45);background:rgba(255,215,0,.14);color:#fff;cursor:pointer}
#tuvi-laso-app .tv-lock-btn:hover{background:rgba(255,215,0,.22)}
#tuvi-laso-app .tv-lock-msg{font-size:13px;margin-top:6px;width:100%}
#tuvi-laso-app .tv-lock-msg.ok{color:#9ae6b4}
#tuvi-laso-app .tv-lock-msg.err{color:#fca5a5}
#tuvi-laso-app .tv-lock-open{padding-top:8px}
#tuvi-laso-app .tv-lock-title{margin:0 0 8px}
#tuvi-laso-app .tv-lock-body{line-height:1.65}
/* ===== Year overlay lines (Kiểu A) ===== */
#tuvi-laso-app .tv-yearlines{
  margin-top: 6px;
  padding-top: 6px;
  border-top: 1px dashed rgba(255,255,255,.14);
  font-size: 11px;
  line-height: 1.35;
  opacity: .95;
}

#tuvi-laso-app .tv-yearline b{ font-weight: 800; }

#tuvi-laso-app .tv-yearline.tv-ln{ color: rgba(255,215,90,.95); } /* vàng */
#tuvi-laso-app .tv-yearline.tv-l{  color: rgba(160,220,255,.95); } /* xanh nhạt */
.tv-yearlines{
  margin-top: 6px;
  padding: 6px 8px;
  border-top: 1px dashed rgba(0,0,0,.12);
  font-size: 12px;
  line-height: 1.35;
}
.tv-yearline b{ font-weight: 800; }
.tv-yearline.tv-l{ opacity: .95; }
:root{
  --el-kim: #c9ced6;
  --el-moc: #33c26b;
  --el-thuy:#38a6ff;
  --el-hoa: #ff4b4b;
  --el-tho: #f1c232; /* vàng như mẫu */
}

.tv-palace[data-el="kim"]  .tv-palace-title{ color: var(--el-kim); }
.tv-palace[data-el="moc"]  .tv-palace-title{ color: var(--el-moc); }
.tv-palace[data-el="thuy"] .tv-palace-title{ color: var(--el-thuy); }
.tv-palace[data-el="hoa"]  .tv-palace-title{ color: var(--el-hoa); }
.tv-palace[data-el="tho"]  .tv-palace-title{ color: var(--el-tho); }
.star-main{ color:#ff3b30; font-weight:700; } /* đỏ nổi */
.star-van { color:#4aa3ff; font-weight:600; } /* xanh dương */
.star-hung{ color:#ff6b6b; font-weight:600; } /* đỏ nhạt/cảnh báo */
.star-phu { color:#b9c0c8; }                  /* xám sáng */
.star-l   { color:#ff3b30; font-weight:700; } /* Lưu niên đỏ tươi */
/* ============================================================
 * Paywall box (dưới tiêu đề "Luận giải chi tiết các cung")
 * ============================================================ */
.tv-paywall-box{
  margin: 14px 0 18px;
  border: 1px solid rgba(0,0,0,.08);
  box-shadow: 0 10px 26px rgba(0,0,0,.10);
}
.tv-paywall-title{
  font-weight: 800;
  font-size: 26px;
  letter-spacing: .2px;
  margin-bottom: 10px;
  color: #111;
}
.tv-paywall-list{
  margin: 0 0 14px 18px;
  padding: 0;
  color: #333;
  font-size: 16px;
  line-height: 1.55;
}
.tv-paywall-actions{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  align-items:center;
}
.tv-paywall-sample{
  background:#fff;
  border:1px solid rgba(0,0,0,.20);
  color:#111;
}
.tv-paywall-sample:hover{ filter: brightness(0.98); }
.tv-paywall-unlock{
  background: var(--tv-accent, #C7A23E);
  border: 1px solid rgba(0,0,0,.12);
  color: #fff;
  padding: 10px 16px;
  border-radius: 999px;
  font-weight: 800;
}
.tv-paywall-unlock:hover{ filter: brightness(1.03); }
@media (max-width: 520px){
  .tv-paywall-actions{ flex-direction:column; align-items:stretch; }
  .tv-paywall-actions > *{ width:100%; text-align:center; justify-content:center; }
}

/* ============================================================
 * Spotlight cards: làm 2 ô trắng nổi bật hơn các ô còn lại
 * - Nhận xét ngắn gọn (tv-spotlight-quick)
 * - Nội dung trả phí + CTA (tv-spotlight-paywall)
 * Ưu tiên tương phản + viền vàng + bóng đổ + nền highlight nhẹ.
 * ============================================================ */
#tuvi-laso-app .tv-spotlight{
  background: rgba(255,255,255,0.985) !important;
  color: #111 !important;
  border: 2px solid rgba(199,162,62,0.95) !important;
  border-radius: 18px !important;
  box-shadow:
    0 18px 60px rgba(0,0,0,0.40),
    0 0 0 1px rgba(199,162,62,0.22) inset;
  position: relative;
  overflow: hidden;
}

#tuvi-laso-app .tv-spotlight::before{
  content:"";
  position:absolute;
  inset:-2px;
  background:
    radial-gradient(1200px 280px at 18% 0%, rgba(199,162,62,0.18), transparent 60%),
    radial-gradient(900px 260px at 82% 105%, rgba(255,160,60,0.10), transparent 60%);
  pointer-events:none;
}

#tuvi-laso-app .tv-spotlight > *{ position:relative; }

/* --- Nhận xét ngắn gọn: header + đoạn mô tả + CTA --- */
#tuvi-laso-app .tv-spotlight-quick .tv-i-head{
  color: #8a5a00 !important;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}

#tuvi-laso-app .tv-spotlight-quick .tv-i-desc{
  font-size: 16px;
  line-height: 1.75;
  color:#1a1a1a;
}

#tuvi-laso-app .tv-spotlight-quick .tv-open-nhanxet{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  margin-top: 8px;
  padding: 10px 14px;
  border-radius: 14px;
  font-weight: 900;
  text-decoration:none;
  color:#111;
  background: linear-gradient(180deg, rgba(199,162,62,0.30), rgba(199,162,62,0.12));
  border: 1px solid rgba(0,0,0,0.12);
  box-shadow: 0 10px 22px rgba(0,0,0,0.16);
}
#tuvi-laso-app .tv-spotlight-quick .tv-open-nhanxet:hover{
  transform: translateY(-1px);
  filter: brightness(1.02);
}

/* --- Paywall: bố cục + list check + 2 nút cân đối --- */
#tuvi-laso-app .tv-spotlight-paywall{
  padding: 22px 22px 20px;
}

#tuvi-laso-app .tv-spotlight-paywall .tv-paywall-title{
  font-size: 28px;
  margin: 0 0 12px 0;
  font-weight: 900;
  color:#111;
}

#tuvi-laso-app .tv-spotlight-paywall .tv-paywall-list{
  list-style: none;
  margin: 0 0 16px 0;
  padding: 0;
  display: grid;
  gap: 10px;
  color:#222;
}

#tuvi-laso-app .tv-spotlight-paywall .tv-paywall-list li{
  padding-left: 30px;
  position: relative;
  font-size: 16px;
  line-height: 1.55;
}

#tuvi-laso-app .tv-spotlight-paywall .tv-paywall-list li::before{
  content: "✓";
  position:absolute;
  left: 0;
  top: 1px;
  width: 20px;
  height: 20px;
  border-radius: 999px;
  background: rgba(199,162,62,0.28);
  color: #6a4300;
  font-weight: 900;
  display:flex;
  align-items:center;
  justify-content:center;
}

#tuvi-laso-app .tv-spotlight-paywall .tv-paywall-actions{
  margin-top: 14px;
  justify-content: center;
  gap: 12px;
}

#tuvi-laso-app .tv-spotlight-paywall .tv-paywall-actions .tv-btn{
  min-width: 210px;
  padding: 12px 18px;
  border-radius: 16px;
  font-weight: 900;
}

#tuvi-laso-app .tv-spotlight-paywall .tv-paywall-sample{
  background: #fff;
  border: 1px solid rgba(0,0,0,0.18);
  box-shadow: 0 12px 26px rgba(0,0,0,0.14);
}

#tuvi-laso-app .tv-spotlight-paywall .tv-paywall-unlock{
  background: linear-gradient(180deg, rgba(199,162,62,1), rgba(163,126,30,1));
  border: 1px solid rgba(0,0,0,0.14);
  box-shadow: 0 16px 36px rgba(199,162,62,0.25), 0 10px 22px rgba(0,0,0,0.18);
}

#tuvi-laso-app .tv-spotlight-paywall .tv-paywall-unlock:hover{
  filter: brightness(1.04);
  transform: translateY(-1px);
}

/* Tăng khoảng cách nhẹ giữa tiêu đề section và spotlight card */
#tuvi-laso-app .tv_sec_dv .tv-spotlight{ margin-top: 12px; }
#tuvi-laso-app .tv_sec_palaces .tv-spotlight-paywall{ margin-top: 14px; }

@media (max-width: 520px){
  #tuvi-laso-app .tv-spotlight-paywall{ padding: 18px 16px 16px; }
  #tuvi-laso-app .tv-spotlight-paywall .tv-paywall-title{ font-size: 24px; }
}


/* ============================================================
 * UI – Ô "Nhận xét ngắn gọn" (match ảnh mẫu)
 * ============================================================ */
#tuvi-laso-app .tv-nhanxet-box{
  background:#fff;
  border:1px solid #d7dde5;
  border-bottom:3px solid var(--tv-accent, #C7A23E);
  border-radius:3px;
  overflow:hidden;
  margin: 16px 0;
}

#tuvi-laso-app .tv-nhanxet-head{
  display:flex;
  align-items:center;
  gap:10px;
  padding: 12px 14px;
  background:#f7f9fb;
  border-bottom:1px solid #e6ebf2;
}

#tuvi-laso-app .tv-nhanxet-head-ico{
  font-size: 16px;
  line-height: 1;
}

#tuvi-laso-app .tv-nhanxet-head-text{
  font-weight: 900;
  letter-spacing: .10em;
  text-transform: uppercase;
  color:#111;
  font-size: 13px;
}

#tuvi-laso-app .tv-nhanxet-body{
  padding: 26px 16px 28px;
  text-align:center;
}

#tuvi-laso-app .tv-nhanxet-lock-ico{
  width: 56px;
  height: 56px;
  border:1px solid #e6ebf2;
  border-radius:2px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin: 0 auto 14px;
  background:#fff;
  color:#9ca3af;
  font-size: 22px;
}


#tuvi-laso-app .tv-nhanxet-title{
  margin: 0 0 8px;
  font-size: 22px;
  font-weight: 900;
  letter-spacing: .02em;
  text-transform: uppercase;
  color:#111;
}

#tuvi-laso-app .tv-nhanxet-desc{
  max-width: 560px;
  margin: 0 auto 18px;
  font-size: 14px;
  line-height: 1.65;
  color:#6b7280;
}

#tuvi-laso-app .tv-nhanxet-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap: 12px;
  padding: 12px 28px;
  background: var(--tv-accent, #C7A23E);
  color:#fff;
  text-decoration:none;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
  border-radius: 2px;
  border: 1px solid rgba(0,0,0,0.10);
  box-shadow: 0 10px 22px rgba(0,0,0,0.14);
  transition: transform .12s ease, filter .12s ease;
}

#tuvi-laso-app .tv-nhanxet-btn:hover{
  transform: translateY(-1px);
  filter: brightness(1.04);
}

#tuvi-laso-app .tv-nhanxet-btn-arrow{
  font-size: 18px;
  line-height: 1;
  margin-top: -1px;
}

/* open state: canh trái nhẹ để đọc nội dung */
#tuvi-laso-app .tv-nhanxet-open-body{
  text-align:left;
}

#tuvi-laso-app .tv-nhanxet-open-title{
  font-size: 18px;
  font-weight: 900;
  margin: 0 0 8px;
  color:#111;
}
/* Paywall card giống ảnh */
.tv-paywall-card{
  padding:18px 18px 16px;
  border-radius:18px;
  border:1px solid rgba(0,0,0,.06);
  background:linear-gradient(180deg, rgba(255,255,255,.96), rgba(249,250,251,.96));
  box-shadow:0 8px 24px rgba(0,0,0,.04);
  margin:12px 0 14px;
}

.tv-paywall-badge{
  display:inline-block;
  font-weight:700;
  font-size:12px;
  letter-spacing:.2px;
  padding:6px 10px;
  border-radius:999px;
  background:#fff7ed;
  color:#b45309;
  border:1px solid rgba(245,158,11,.25);
  margin-bottom:10px;
}

.tv-paywall-title{
  font-size:20px;
  font-weight:800;
  color:#111827;
  margin-bottom:14px;
}

/* List rows */
.tv-paywall-list{ display:flex; flex-direction:column; gap:14px; }

.tv-paywall-row{
  display:flex;
  gap:10px;
  align-items:flex-start;
}

.tv-paywall-check{
  width:22px; height:22px;
  border-radius:999px;
  display:inline-flex;
  align-items:center; justify-content:center;
  font-weight:900;
  font-size:13px;
  background:#f59e0b;
  color:#fff;
  flex:0 0 22px;
  margin-top:2px;
}

.tv-paywall-row-h{
  font-weight:800;
  color:#111827;
  font-size:15px;
  line-height:1.25;
  margin-bottom:3px;
}

.tv-paywall-row-d{
  color:#6b7280;
  font-size:13.5px;
  line-height:1.45;
}

/* Buttons */
.tv-paywall-actions{
  display:flex;
  gap:12px;
  margin-top:18px;
  flex-wrap:wrap;
}

.tv-paywall-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:44px;
  padding:0 18px;
  border-radius:14px;
  font-weight:800;
  text-decoration:none;
  cursor:pointer;
  user-select:none;
}

.tv-paywall-btn-outline{
  background:#fff;
  color:#111827;
  border:1px solid rgba(17,24,39,.14);
}

/* căn giữa + khoảng cách đẹp */
.tv-paywall-actions{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:16px;
  margin-top:22px;
  flex-wrap:wrap;
}

/* nút to lên, nhìn “premium” */
.tv-paywall-btn{
  min-width:220px;          /* giúp 2 nút cân nhau */
  height:52px;              /* to hơn */
  padding:0 22px;
  border-radius:16px;
  font-size:16px;
  font-weight:900;
  letter-spacing:.2px;
  line-height:1;
  transition:transform .12s ease, box-shadow .12s ease, filter .12s ease, background-color .12s ease;
}

/* nút phụ (Xem lá số mẫu) đẹp hơn */
.tv-paywall-btn-outline{
  background:#ffffff;
  border:1px solid rgba(17,24,39,.16);
  color:#111827;
  box-shadow:0 6px 16px rgba(0,0,0,.06);
}

.tv-paywall-btn-outline:hover{
  transform:translateY(-1px);
  box-shadow:0 10px 22px rgba(0,0,0,.10);
  background:#f9fafb;
}



/* bấm xuống có cảm giác */
.tv-paywall-btn:active{
  transform:translateY(0px) scale(.99);
}

/* Mobile: mỗi nút full-width cho dễ bấm */
@media (max-width: 640px){
  .tv-paywall-btn{
    min-width: min(520px, 100%);
    width:100%;
  }
  .tv-paywall-actions{ gap:12px; }
}
/* ===== đổi màu: 1 nút vàng, 1 nút đỏ, chữ trắng ===== */


/* nút đỏ (outline -> chuyển thành đỏ luôn) */
.tv-paywall-btn-outline{
  background: linear-gradient(180deg, #ef4444, #dc2626);
  border: 1px solid rgba(220,38,38,.65);
  color: #ffffff !important;
  box-shadow: 0 12px 28px rgba(220,38,38,.28);
}
.tv-paywall-btn-outline:hover{
  filter: brightness(1.05);
  transform: translateY(-1px);
  box-shadow: 0 16px 34px rgba(220,38,38,.36);
}



/* optional: focus rõ ràng khi tab */
.tv-paywall-btn:focus{
  outline: none;
  box-shadow: 0 0 0 4px rgba(250,204,21,.25), 0 12px 28px rgba(0,0,0,.18);
}
.tv-paywall-btn-outline:focus{
  box-shadow: 0 0 0 4px rgba(239,68,68,.22), 0 12px 28px rgba(0,0,0,.18);
}
/* ===== WRAP 2 NÚT: canh giữa + khoảng cách ===== */
.tv-paywall-btns {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 18px;
    flex-wrap: wrap;
    /* mobile xuống hàng */
}

/* ===== CHUNG CHO CẢ 2 NÚT: to, đều, sang ===== */
.tv-paywall-btn-outline,
.tv-paywall-btn-primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding: 16px 38px !important;
    /* tăng độ to */
    min-width: 260px;
    /* ép bề ngang tối thiểu */
    height: 56px;
    /* ép chiều cao */
    line-height: 1 !important;
    font-size: 18px !important;
    font-weight: 800;

    border-radius: 999px !important;
    /* pill */
    text-decoration: none !important;
    box-sizing: border-box;
}
/* =========================================================
   PAYWALL BUTTONS — FIX KÍCH THƯỚC + MÀU SẮC (override cuối)
   - Nút "Mở luận giải": xanh lá + chữ vàng
   - Đảm bảo 2 nút bằng kích thước nhau
========================================================= */

/* 1) Container: canh giữa và khoảng cách */
.tv-paywall-actions,
.tv-paywall-btns {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 16px !important;
    flex-wrap: wrap !important;
}

/* 2) Chuẩn kích thước CHUNG cho mọi kiểu nút trong paywall */
.tv-paywall-actions .tv-paywall-btn,
.tv-paywall-actions .tv-paywall-btn-outline,
.tv-paywall-actions .tv-paywall-btn-primary,
.tv-paywall-actions .tv-paywall-sample,
.tv-paywall-actions .tv-paywall-unlock {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    height: 56px !important;
    padding: 0 38px !important;
    min-width: 260px !important;
    /* <- điểm quan trọng để 2 nút không lệch */
    line-height: 1 !important;

    border-radius: 999px !important;
    font-size: 18px !important;
    font-weight: 900 !important;
    letter-spacing: .02em !important;
    text-decoration: none !important;
    box-sizing: border-box !important;
}

/* 3) Nút "Xem lá số mẫu" (đang OK) — giữ đỏ chữ vàng như bạn đang muốn */
.tv-paywall-actions .tv-paywall-btn-outline,
.tv-paywall-actions .tv-paywall-sample {
    background: linear-gradient(180deg, #ef4444, #dc2626) !important;
    border: 1px solid rgba(220, 38, 38, .65) !important;
    color: #ffd36a !important;
    /* vàng */
    box-shadow: 0 12px 28px rgba(220, 38, 38, .28) !important;
}

/* 4) Nút "MỞ LUẬN GIẢI" — XANH LÁ + CHỮ VÀNG (áp cho cả 2 class khả dĩ) */
.tv-paywall-actions .tv-paywall-btn-primary,
.tv-paywall-actions .tv-paywall-unlock {
    background: linear-gradient(180deg, #22c55e, #16a34a) !important;
    border: 1px solid rgba(22, 163, 74, .75) !important;
    color: #ffd36a !important;
    /* chữ vàng */
    box-shadow: 0 14px 34px rgba(22, 163, 74, .28) !important;
}

/* hover/active cho đẹp */
.tv-paywall-actions .tv-paywall-btn-outline:hover,
.tv-paywall-actions .tv-paywall-sample:hover,
.tv-paywall-actions .tv-paywall-btn-primary:hover,
.tv-paywall-actions .tv-paywall-unlock:hover {
    filter: brightness(1.05) !important;
    transform: translateY(-1px) !important;
}

.tv-paywall-actions .tv-paywall-btn-outline:active,
.tv-paywall-actions .tv-paywall-sample:active,
.tv-paywall-actions .tv-paywall-btn-primary:active,
.tv-paywall-actions .tv-paywall-unlock:active {
    transform: translateY(0) scale(.99) !important;
}

/* Mobile: 2 nút full width cho dễ bấm */
@media (max-width: 640px) {

    .tv-paywall-actions .tv-paywall-btn,
    .tv-paywall-actions .tv-paywall-btn-outline,
    .tv-paywall-actions .tv-paywall-btn-primary,
    .tv-paywall-actions .tv-paywall-sample,
    .tv-paywall-actions .tv-paywall-unlock {
        width: 100% !important;
        min-width: 0 !important;
    }
}
/* =========================================
   1) XOÁ ICON Ổ KHOÁ (ô Nhận xét ngắn gọn)
========================================= */

/* icon ổ khoá trong box nhận xét */
#tuvi-laso-app .tv-nhanxet-lock-ico,
#tuvi-laso-app .tv-nhanxet-lock-ico * {
    display: none !important;
}

/* nếu icon ổ khoá là SVG/img riêng (fallback) */
#tuvi-laso-app .tv-nhanxet-body svg,
#tuvi-laso-app .tv-nhanxet-body img {
    display: none !important;
}

/* =========================================
   2) XOÁ CỤM CHỮ Ở DƯỚI (bạn khoanh đỏ)
   - "Nhận xét ngắn gọn"
   - "Đã mở khóa. (...AI/engine...)"
========================================= */

/* tiêu đề nhỏ bên dưới */
#tuvi-laso-app .tv-nhanxet-open-title {
    display: none !important;
}

/* đoạn mô tả "Đã mở khóa..." */
#tuvi-laso-app .tv-nhanxet-open-body,
#tuvi-laso-app .tv-nhanxet-open-body p,
#tuvi-laso-app .tv-nhanxet-open-body .muted {
    display: none !important;
}

/* nếu bạn còn thấy dòng đó vì HTML render khác class,
   bắt thêm theo text area dưới box (fallback an toàn) */
#tuvi-laso-app .tv-nhanxet-box .muted {
    display: none !important;
}

/* =========================================
   3) "NỘI DUNG TRẢ PHÍ BAO GỒM" -> IN HOA + CĂN GIỮA
========================================= */
#tuvi-laso-app .tv-paywall-title {
    text-transform: uppercase !important;
    text-align: center !important;
    width: 100% !important;
    margin: 6px 0 14px !important;
    letter-spacing: .08em !important;
    /* nhìn “premium” */
    font-weight: 950 !important;
}

/* nếu tiêu đề đang nằm trong block flex, ép nó chiếm full */
#tuvi-laso-app .tv-spotlight-paywall .tv-paywall-title {
    display: block !important;
}
/* ===== FIX: bỏ viền/ glow của khung lớn bao quanh phần luận giải ===== */
body #tv_interpret{
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}

/* nhiều theme/plugin vẽ viền bằng pseudo-element */
body #tv_interpret::before,
body #tv_interpret::after{
  content: none !important;
  display: none !important;
}
/* ===== FIX: bỏ viền/ glow của khung con (card/lock) ===== */
body #tv_interpret .tv-lock,
body #tv_interpret .tv-i-card,
body #tv_interpret .tv-i-grid{
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}

/* pseudo-element gây viền thứ 2 */
body #tv_interpret .tv-lock::before,
body #tv_interpret .tv-lock::after,
body #tv_interpret .tv-i-card::before,
body #tv_interpret .tv-i-card::after{
  content: none !important;
  display: none !important;
}
/* =========================================
   FIX: BỎ “KHUNG NGOÀI” của cụm Tổng quan
   (wrapper đang tạo viền + glow + bo góc)
========================================= */
#tv_interpret .tv-i-grid{
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  background: transparent !important; /* nếu wrapper đang có nền riêng gây cảm giác “khung” */
}

/* nếu khung ngoài vẽ bằng pseudo-element */
#tv_interpret .tv-i-grid::before,
#tv_interpret .tv-i-grid::after{
  content: none !important;
  display: none !important;
}
/* =========================================
   FIX: GIẢM PADDING/MARGIN để ô con rộng hơn
========================================= */
#tv_interpret{
  padding: 0 !important;         /* bỏ đệm ngoài */
  margin: 14px 0 !important;
}

#tv_interpret_body{
  padding: 0 !important;         /* nhiều bản nhét padding ở body */
  margin: 0 !important;
}

#tv_interpret .tv-i-grid{
  padding: 0 !important;         /* wrapper cụm card */
  margin: 0 !important;
  gap: 14px !important;          /* khoảng cách giữa các ô */
}

#tv_interpret .tv-i-card{
  margin: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
}
/* =========================================
   MOBILE: 1 cột + rộng sát màn hình
========================================= */
@media (max-width: 768px){
  #tv_interpret{
    padding: 0 10px !important;  /* chừa 10px cho thoáng, vẫn rộng */
  }

  #tv_interpret .tv-i-grid{
    grid-template-columns: 1fr !important; /* ép 1 cột */
    gap: 12px !important;
  }

  #tv_interpret .tv-i-card{
    padding: 14px 14px !important; /* giảm đệm trong card */
    border-radius: 14px !important;
  }
}
/* BẮT THÊM các wrapper hay gặp (chỉ trong #tv_interpret) */
#tv_interpret .tv-i-wrap,
#tv_interpret .tv-interp-wrap,
#tv_interpret .tv-section{
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

#tv_interpret .tv-i-wrap::before,
#tv_interpret .tv-i-wrap::after,
#tv_interpret .tv-interp-wrap::before,
#tv_interpret .tv-interp-wrap::after,
#tv_interpret .tv-section::before,
#tv_interpret .tv-section::after{
  content: none !important;
  display: none !important;
}
/* ===== MOBILE: đảm bảo lá số có chỗ để hiển thị ===== */
@media (max-width: 768px){
  #tv_chart{
    display:block !important;
    min-height: 420px !important;      /* chống collapse */
    overflow: visible !important;
  }

  #tv_board_wrap{
    display:block !important;
    width: 100% !important;
    overflow: auto !important;         /* cho phép kéo ngang nếu cần */
    -webkit-overflow-scrolling: touch;
  }

  /* board không được “kẹt” ở display none */
  #tv_board_wrap .tv-board{
    display:grid !important;
  }
}
/* ====== MOBILE: mở rộng bề ngang nội dung ====== */
@media (max-width: 768px){

  /* Bỏ các padding lớn ở khu vực luận giải */
  #tv_interpret,
  #tv_interpret_body{
    padding-left: 10px !important;
    padding-right: 10px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
  }

  /* Wrapper hay gây “2 lớp viền” */
  #tv_interpret .tv-i-grid{
    border: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    padding: 0 !important;
    margin: 0 !important;

    /* ép về 1 cột để card rộng */
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  /* Nếu wrapper vẽ viền bằng pseudo-element */
  #tv_interpret .tv-i-grid::before,
  #tv_interpret .tv-i-grid::after{
    content:none !important;
    display:none !important;
  }

  /* Card bên trong: giảm padding để chữ rộng hơn */
  #tv_interpret .tv-i-card{
    padding: 14px 14px !important;
    margin: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Tiêu đề và text: tránh bị co quá */
  #tv_interpret .tv-i-card p{
    font-size: 15.5px !important;
    line-height: 1.7 !important;
  }
}
/* =========================
   1) TĂNG CỠ TIÊU ĐỀ BOX (Nhận xét / 2026)
   ========================= */
.tv-palace-extra .tv-palace-title{
  font-size: clamp(18px, 2.1vw, 26px) !important;
  line-height: 1.25 !important;
  letter-spacing: 1.6px !important;
}

/* =========================
   2) CĂN GIỮA 2 BOX “Nhận xét” & “Vận hạn 2026”
   - Căn giữa tiêu đề + nội dung + nút “Mở luận giải”
   ========================= */
.tv-palace-extra{
  text-align: center !important;
}

/* nếu head đang bị flex lệch trái */
.tv-palace-extra .tv-palace-head{
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}

/* ép các cụm trong hộp khóa (bạn không chắc class nào thì để nhiều selector như này) */
.tv-palace-extra .tv-locked,
.tv-palace-extra .tv-locked-box,
.tv-palace-extra .tv-paywall,
.tv-palace-extra .tv-paywall-box{
  text-align: center !important;
}

/* nút mở luận giải: kéo vào giữa */
.tv-palace-extra button,
.tv-palace-extra .tv-btn,
.tv-palace-extra a.tv-btn{
  margin-left: auto !important;
  margin-right: auto !important;
}

/* nếu trong hộp khóa dùng flex cho dòng nút, ép nó center */
.tv-palace-extra .tv-actions,
.tv-palace-extra .tv-locked-actions,
.tv-palace-extra .tv-paywall-actions{
  display: flex !important;
  justify-content: center !important;
  gap: 10px !important;
}

/* (tuỳ chọn) nếu bạn muốn 2 box này “gọn” và nằm giữa trang (không full ngang)
.tv-palace-extra{
  max-width: 860px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
*/
html.tv-modal-open { overflow: hidden; }

/* Modal base */
.tv-modal{
  display:none;
  position:fixed;
  inset:0;
  z-index:99999;
}
.tv-modal.is-open{ display:block; }

.tv-modal__overlay{
  position:absolute;
  inset:0;
  background: rgba(0,0,0,.62);
  backdrop-filter: blur(2px);
}

.tv-modal__panel{
  position:relative;
  width:min(560px, calc(100vw - 24px));
  margin:10vh auto;
  border-radius:18px;
  padding:18px 16px;
  background:#0b1220;              /* nền tối */
  color:#fff;
  border:1px solid rgba(245,158,11,.35); /* viền vàng */
  box-shadow: 0 20px 60px rgba(0,0,0,.55);
}

.tv-modal__close{
  position:absolute;
  right:10px; top:10px;
  width:36px; height:36px;
  border-radius:12px;
  border:1px solid rgba(245,158,11,.35);
  background:transparent;
  color:#fff;
  cursor:pointer;
  font-size:22px;
  line-height:30px;
}

.tv-modal__title{
  font-weight:800;
  font-size:18px;
  margin-bottom:10px;
}
.tv-modal__body .tv-muted{
  opacity:.85;
  line-height:1.55;
  margin:0 0 14px;
}

.tv-modal__actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

/* nếu bạn đã có .tv-btn rồi thì bỏ phần dưới */
.tv-modal__actions .tv-btn{
  height:42px;
  padding:0 14px;
  border-radius:12px;
  border:1px solid rgba(245,158,11,.45);
  background: rgba(245,158,11,.12);
  color:#fff;
  cursor:pointer;
}
.tv-modal__actions .tv-btn:hover{
  background: rgba(245,158,11,.18);
}
/* ===== Sample inside modal ===== */
#tv-sample-modal .tv-modal__sample{
  margin-top: 12px;
  max-height: 52vh;
  overflow: auto;
  padding-right: 6px;
}
#tv-sample-modal .tv-sample-grid{
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
}
#tv-sample-modal .tv-sample-box{
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.04);
  border-radius: 12px;
  padding: 10px 12px;
}
#tv-sample-modal .tv-sample-h{
  font-weight: 900;
  margin-bottom: 6px;
}
#tv-sample-modal .tv-sample-p{
  opacity: .92;
  line-height: 1.45;
}
#tv-sample-modal .tv-sample-kv{
  margin-top: 8px;
  opacity: .9;
  font-size: 13px;
}
/* =========================
   PREMIUM SAMPLE MODAL
========================= */
:root{
  --tv-gold: #d7b25b;
  --tv-gold-2:#f3d27b;
  --tv-ink:#0b1220;
  --tv-card: rgba(255,255,255,.06);
  --tv-line: rgba(255,255,255,.10);
}

#tv-sample-modal .tv-modal__panel{
  width: min(980px, calc(100vw - 24px));
  max-height: min(82vh, 760px);
  border-radius: 18px;
  overflow: hidden;
  border: 1px solid rgba(215,178,91,.35);
  box-shadow: 0 20px 70px rgba(0,0,0,.55);
}

#tv-sample-modal .tv-modal__title{
  display:none; /* ẩn title cũ để dùng header mới */
}

#tv-sample-modal .tv-modal__body{
  padding: 0;
}

/* Header */
#tv-sample-modal .tv-sample-hero{
  padding: 16px 18px 14px;
  background:
    radial-gradient(1200px 420px at 15% 0%, rgba(215,178,91,.22), transparent 55%),
    radial-gradient(800px 400px at 90% 0%, rgba(125,60,255,.18), transparent 55%),
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
  border-bottom: 1px solid rgba(215,178,91,.25);
}

#tv-sample-modal .tv-sample-hero-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

#tv-sample-modal .tv-sample-h1{
  margin:0;
  font-weight: 900;
  font-size: 20px;
  letter-spacing:.2px;
}

#tv-sample-modal .tv-sample-sub{
  margin-top: 6px;
  opacity: .9;
  line-height: 1.35;
}

#tv-sample-modal .tv-sample-badges{
  margin-top: 12px;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

#tv-sample-modal .tv-chip{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.05);
  font-weight: 800;
  font-size: 12.5px;
  white-space:nowrap;
}
#tv-sample-modal .tv-chip--gold{
  border-color: rgba(215,178,91,.40);
  background: rgba(215,178,91,.14);
  color: var(--tv-gold-2);
}

/* Body layout */
#tv-sample-modal .tv-sample-wrap{
  padding: 14px 16px 10px;
}

#tv-sample-modal .tv-sample-grid2{
  display:grid;
  grid-template-columns: 1.08fr .92fr;
  gap: 12px;
}

/* Cards */
#tv-sample-modal .tv-box{
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 14px;
  padding: 12px 12px;
}

#tv-sample-modal .tv-box .tv-box-h{
  font-weight: 950;
  margin-bottom: 8px;
  display:flex;
  align-items:center;
  gap:8px;
}
#tv-sample-modal .tv-ico{
  width: 26px; height: 26px;
  border-radius: 10px;
  display:flex;
  align-items:center;
  justify-content:center;
  border: 1px solid rgba(215,178,91,.35);
  background: rgba(215,178,91,.12);
  color: var(--tv-gold-2);
  font-weight: 900;
}

#tv-sample-modal .tv-kv{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top: 8px;
}
#tv-sample-modal .tv-kv span{
  padding: 6px 10px;
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.04);
  font-weight: 800;
  font-size: 12.5px;
}
#tv-sample-modal .tv-kv b{ color: var(--tv-gold-2); }

/* Highlights */
#tv-sample-modal .tv-hi{
  margin:0;
  padding-left: 18px;
  line-height: 1.45;
}
#tv-sample-modal .tv-hi li{
  margin: 6px 0;
}
#tv-sample-modal .tv-mark{
  color: var(--tv-gold-2);
  font-weight: 900;
}

/* 14 stars badge */
#tv-sample-modal .tv-stars{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
#tv-sample-modal .tv-star{
  padding: 7px 10px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.04);
  font-weight: 900;
  font-size: 12.5px;
}
#tv-sample-modal .tv-star--main{
  border-color: rgba(215,178,91,.42);
  background: rgba(215,178,91,.14);
  color: var(--tv-gold-2);
}
#tv-sample-modal .tv-star--good{
  border-color: rgba(34,197,94,.30);
  background: rgba(34,197,94,.12);
}
#tv-sample-modal .tv-star--bad{
  border-color: rgba(245,158,11,.28);
  background: rgba(245,158,11,.10);
}

/* Mini chart 12 palaces */
#tv-sample-modal .tv-mini-chart{
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
}
#tv-sample-modal .tv-pal{
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.03);
  padding: 8px 9px;
  min-height: 64px;
}
#tv-sample-modal .tv-pal .tv-pal-name{
  font-weight: 950;
  font-size: 12.5px;
  display:flex;
  justify-content:space-between;
  gap:8px;
}
#tv-sample-modal .tv-pal .tv-pal-tag{
  font-size: 11px;
  font-weight: 900;
  opacity:.95;
  color: var(--tv-gold-2);
}
#tv-sample-modal .tv-pal .tv-pal-note{
  margin-top: 6px;
  opacity: .92;
  font-size: 12px;
  line-height: 1.35;
}

/* Footer actions */
#tv-sample-modal .tv-modal__actions{
  display:flex;
  justify-content:space-between;
  gap: 10px;
  padding: 12px 16px 16px;
  border-top: 1px solid rgba(255,255,255,.10);
  background: linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.00));
}

#tv-sample-modal .tv-paywall-btn{
  min-width: 160px;
  border-radius: 999px;
}

#tv-sample-modal .tv-paywall-btn-outline{
  border-color: rgba(215,178,91,.45) !important;
}

@media (max-width: 860px){
  #tv-sample-modal .tv-sample-grid2{ grid-template-columns: 1fr; }
  #tv-sample-modal .tv-mini-chart{ grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 520px){
  #tv-sample-modal .tv-mini-chart{ grid-template-columns: repeat(2, 1fr); }
  #tv-sample-modal .tv-paywall-btn{ min-width: 0; width: 100%; }
  #tv-sample-modal .tv-modal__actions{ flex-direction: column; }
}
/* ===== 12 cung (1 cột dọc, card rõ ràng) ===== */
#tv-sample-modal .tv-12-list{
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  margin-top: 10px;
}

#tv-sample-modal .tv-pal2{
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.04);
  overflow: hidden;
}

#tv-sample-modal .tv-pal2-h{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding: 12px 12px;
  border-bottom: 1px solid rgba(255,255,255,.08);
  background: rgba(0,0,0,.10);
}

#tv-sample-modal .tv-pal2-left{
  display:flex;
  align-items:center;
  gap:10px;
  min-width: 0;
}

#tv-sample-modal .tv-pal2-dot{
  width: 28px;
  height: 28px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius: 10px;
  border: 1px solid rgba(215,178,91,.25);
  background: rgba(215,178,91,.10);
  flex: 0 0 auto;
}

#tv-sample-modal .tv-pal2-name{
  font-weight: 950;
  font-size: 15px;
  letter-spacing: .2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#tv-sample-modal .tv-pal2-tag{
  font-weight: 900;
  font-size: 12px;
  padding: 6px 10px;
  border-radius: 999px;
  white-space: nowrap;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.06);
}

/* tag màu (nhẹ, sang) */
#tv-sample-modal .tv-tag-gold{ border-color: rgba(215,178,91,.28); background: rgba(215,178,91,.10); color: var(--tv-gold-2); }
#tv-sample-modal .tv-tag-emerald{ border-color: rgba(16,185,129,.25); background: rgba(16,185,129,.10); }
#tv-sample-modal .tv-tag-sky{ border-color: rgba(56,189,248,.25); background: rgba(56,189,248,.10); }
#tv-sample-modal .tv-tag-violet{ border-color: rgba(167,139,250,.25); background: rgba(167,139,250,.10); }
#tv-sample-modal .tv-tag-rose{ border-color: rgba(251,113,133,.25); background: rgba(251,113,133,.10); }
#tv-sample-modal .tv-tag-amber{ border-color: rgba(251,191,36,.25); background: rgba(251,191,36,.10); }

/* body 3 dòng */
#tv-sample-modal .tv-pal2-body{
  padding: 12px 12px;
  display: grid;
  gap: 10px;
}

#tv-sample-modal .tv-pal2-row{
  display: grid;
  grid-template-columns: 92px 1fr;
  gap: 10px;
  align-items: start;
}

#tv-sample-modal .tv-lb{
  font-weight: 900;
  opacity: .95;
  padding: 6px 10px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.05);
  text-align: left;
}

#tv-sample-modal .tv-txt{
  font-size: 13.8px;
  line-height: 1.55;
  opacity: .95;
}

/* mobile: label xuống dòng cho thoáng */
@media (max-width: 520px){
  #tv-sample-modal .tv-pal2-row{
    grid-template-columns: 1fr;
  }
  #tv-sample-modal .tv-lb{
    width: fit-content;
  }
}
/* ✅ Tăng diện tích đọc: body chiếm gần full chiều cao popup */
#tv-sample-modal .tv-modal__panel{
  height: min(88vh, 920px);
}

#tv-sample-modal .tv-modal__body{
  max-height: calc(88vh - 90px); /* trừ phần header + padding */
  overflow: auto;
  padding-bottom: 14px;
}

/* Scrollbar gọn (tuỳ thích) */
#tv-sample-modal .tv-modal__body::-webkit-scrollbar{ width: 10px; }
#tv-sample-modal .tv-modal__body::-webkit-scrollbar-thumb{
  border-radius: 999px;
  background: rgba(255,255,255,.18);
}
#tv-sample-modal .tv-modal__body::-webkit-scrollbar-track{
  background: rgba(255,255,255,.06);
}
/* ===== FIX: bỏ mảng trống (ô đen) trong popup lá số mẫu ===== */
#tv-sample-modal .tv-modal__panel{
  height: min(92vh, 920px);           /* tăng chiều cao popup */
  display: flex;
  flex-direction: column;
}

/* body phải co giãn được, và cho phép con flex scroll */
#tv-sample-modal .tv-modal__body{
  flex: 1 1 auto;
  min-height: 0;                      /* QUAN TRỌNG */
  display: flex;
  flex-direction: column;
  overflow: hidden;                  /* scroll dồn vào sample */
}

/* desc giữ nguyên chiều cao */
#tv-sample-modal .tv-modal__desc{
  flex: 0 0 auto;
}

/* sample chiếm toàn bộ phần còn lại và tự scroll */
#tv-sample-modal .tv-modal__sample{
  flex: 1 1 auto;
  min-height: 0;                      /* QUAN TRỌNG */
  overflow: auto;

  /* nếu trước đó bạn set height/max-height thì phải phá nó */
  height: auto !important;
  max-height: none !important;
}
/* X luôn nổi trên cùng và click được */
.tv-modal__close{
  position: absolute;
  top: 16px;
  right: 16px;
  z-index: 9999;
  pointer-events: auto;
}

/* overlay chỉ nằm dưới panel */
.tv-modal__overlay{
  z-index: 1;
}
.tv-modal__panel{
  position: relative;
  z-index: 2;
}
/* =========================
   PALACES UI CLEAN (14 cung)
   - Bỏ viền bọc ngoài
   - Card từng cung rõ ràng hơn, ít viền
   - Có vạch vàng bên trái + badge "CUNG SỐ ..."
========================= */

/* =========================================================
   FORCE PALACE CARD STYLE (ĐÈ HẾT – đặt cuối file)
   - Sửa vấn đề bị tắt ::before/::after bằng !important
   - Bỏ khung ngoài interpret
   - Card cung rõ ràng, vạch vàng + badge "CUNG SỐ"
========================================================= */

/* A) BỎ KHUNG NGOÀI #tv_interpret */
#tuvi-laso-app #tv_interpret,
#tv_interpret{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}

/* wrapper hay gây “2 lớp khung” */
#tuvi-laso-app #tv_interpret .tv-i-grid,
#tv_interpret .tv-i-grid{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  gap: 14px !important;
}

/* B) ĐÁNH SỐ CUNG (counter) – scope theo section cung nếu có */
#tuvi-laso-app :is(#tv_sec_palaces,#tv_sec_cung,#tv_sec_palace),
#tv_interpret{
  counter-reset: tvpal !important;
}

#tuvi-laso-app :is(#tv_sec_palaces,#tv_sec_cung,#tv_sec_palace) :is(.tv-palace,.tv-i-card),
#tv_interpret :is(.tv-palace,.tv-i-card){
  counter-increment: tvpal !important;
}

/* C) CARD CUNG – áp cho cả .tv-palace và .tv-i-card (để chắc chắn trúng) */
#tuvi-laso-app :is(#tv_sec_palaces,#tv_sec_cung,#tv_sec_palace) :is(.tv-palace,.tv-i-card),
#tv_interpret :is(.tv-palace,.tv-i-card){
  position: relative !important;
  overflow: hidden !important;
  border: 0 !important;
  outline: 0 !important;
  border-radius: 22px !important;

  padding: 18px 18px 16px !important;
  margin: 0 !important;

  background: linear-gradient(180deg, rgba(12,18,35,.94), rgba(8,12,24,.94)) !important;
  box-shadow: 0 18px 55px rgba(0,0,0,.35) !important;
}

/* D) VẠCH VÀNG BÊN TRÁI – BẮT BUỘC dùng !important để đè "content:none !important" */
#tuvi-laso-app :is(#tv_sec_palaces,#tv_sec_cung,#tv_sec_palace) :is(.tv-palace,.tv-i-card)::before,
#tv_interpret :is(.tv-palace,.tv-i-card)::before{
  content: "" !important;
  display: block !important;
  position: absolute !important;
  left: 0; top: 0; bottom: 0;
  width: 3px !important;
  background: linear-gradient(180deg, rgba(255,215,0,0), rgba(255,215,0,.95), rgba(255,215,0,0)) !important;
  opacity: .95 !important;
}

/* E) BADGE "CUNG SỐ ..." – cũng phải !important */
#tuvi-laso-app :is(#tv_sec_palaces,#tv_sec_cung,#tv_sec_palace) :is(.tv-palace,.tv-i-card)::after,
#tv_interpret :is(.tv-palace,.tv-i-card)::after{
  content: "CUNG SỐ " counter(tvpal) !important;
  display: inline-block !important;
  position: absolute !important;
  top: 14px !important;
  right: 14px !important;
  padding: 5px 10px !important;
  border-radius: 999px !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  color: rgba(210,220,245,.85) !important;
  background: rgba(255,255,255,.06) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
}

/* F) TIÊU ĐỀ CUNG */
#tuvi-laso-app #tv_interpret :is(.tv-palace-title, .tv-i-card > h4),
#tv_interpret :is(.tv-palace-title, .tv-i-card > h4){
  margin: 0 0 10px !important;
  padding-right: 120px !important; /* chừa badge */
  color: rgba(235,240,255,.95) !important;
  font-weight: 950 !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
  font-size: 20px !important;
}

/* (tuỳ chọn) icon góc trái giống ảnh nếu HTML chưa có icon */
#tuvi-laso-app #tv_interpret :is(.tv-palace-title, .tv-i-card > h4)::before,
#tv_interpret :is(.tv-palace-title, .tv-i-card > h4)::before{
  content: "✦" !important;
  display: inline-flex !important;
  width: 28px; height: 28px;
  align-items: center; justify-content: center;
  margin-right: 10px;
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.04);
  color: rgba(255,190,80,.95);
  font-weight: 900;
}

/* G) ĐOẠN MÔ TẢ / NỘI DUNG */
#tuvi-laso-app #tv_interpret :is(.tv-i-topic, .tv-palace-sub),
#tv_interpret :is(.tv-i-topic, .tv-palace-sub){
  color: rgba(210,220,245,.72) !important;
  font-weight: 800 !important;
  font-style: italic !important;
}

#tuvi-laso-app #tv_interpret :is(p, .tv-palace-desc),
#tv_interpret :is(p, .tv-palace-desc){
  color: rgba(235,240,255,.86) !important;
  line-height: 1.7 !important;
}

/* Mobile */
@media (max-width: 768px){
  #tuvi-laso-app #tv_interpret :is(.tv-palace,.tv-i-card),
  #tv_interpret :is(.tv-palace,.tv-i-card){
    padding: 14px !important;
    border-radius: 18px !important;
  }
  #tuvi-laso-app #tv_interpret :is(.tv-palace-title, .tv-i-card > h4),
  #tv_interpret :is(.tv-palace-title, .tv-i-card > h4){
    padding-right: 0 !important;
    font-size: 18px !important;
  }
}
/* =========================================================
   FIX PALACE CARD: bỏ vòng tròn/halo + bỏ "CUNG SỐ"
   và ép hiện vạch vàng bên trái
   (Dán CUỐI FILE)
========================================================= */

/* 1) TẮT "badge CUNG SỐ" + mọi pseudo gây vòng tròn ở card
   - ta tắt ::after vì hiện đang dùng để vẽ chữ + halo
*/
#tuvi-laso-app #tv_interpret .tv-i-card::after,
#tv_interpret .tv-i-card::after,
#tuvi-laso-app #tv_interpret .tv-palace::after,
#tv_interpret .tv-palace::after{
  content: none !important;
  display: none !important;
}

/* 2) NẾU vòng tròn đang do 1 lớp con (hay gặp: .tv-halo/.tv-glow/.tv-orb)
   bạn có thể giữ block này, không hại nếu class không tồn tại
*/
#tuvi-laso-app #tv_interpret .tv-halo,
#tuvi-laso-app #tv_interpret .tv-glow,
#tuvi-laso-app #tv_interpret .tv-orb,
#tv_interpret .tv-halo,
#tv_interpret .tv-glow,
#tv_interpret .tv-orb{
  display:none !important;
}

/* 3) ÉP HIỆN VẠCH VÀNG BÊN TRÁI
   - dùng ::before (nhưng ta đảm bảo nó không bị "content:none" giết)
*/
#tuvi-laso-app #tv_interpret .tv-i-card,
#tv_interpret .tv-i-card,
#tuvi-laso-app #tv_interpret .tv-palace,
#tv_interpret .tv-palace{
  position: relative !important;
  overflow: hidden !important;
}

/* vạch vàng */
#tuvi-laso-app #tv_interpret .tv-i-card::before,
#tv_interpret .tv-i-card::before,
#tuvi-laso-app #tv_interpret .tv-palace::before,
#tv_interpret .tv-palace::before{
  content: "" !important;
  display:block !important;
  position:absolute !important;
  left:0 !important;
  top:0 !important;
  bottom:0 !important;
  width: 3px !important;
  background: linear-gradient(
    180deg,
    rgba(255,184,74,0),
    rgba(255,184,74,.95),
    rgba(255,184,74,0)
  ) !important;
  opacity: .95 !important;
  z-index: 2 !important;
}

/* 4) Đảm bảo nội dung card nằm trên vạch */
#tuvi-laso-app #tv_interpret .tv-i-card > *,
#tv_interpret .tv-i-card > *,
#tuvi-laso-app #tv_interpret .tv-palace > *,
#tv_interpret .tv-palace > *{
  position: relative;
  z-index: 3;
}
#tuvi-laso-app .tv-paywall-note19{
  margin-top: 14px;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid rgba(199,162,62,.28);
  background: rgba(199,162,62,.12);
  color: #111;
  font-weight: 850;
  line-height: 1.55;
  box-shadow: 0 10px 22px rgba(0,0,0,.08);
}
#tuvi-laso-app .tv-paywall-note19 .tv-note19-chip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:5px 10px;
  border-radius:999px;
  margin-right:8px;
  font-weight:950;
  color:#141726;
  background: linear-gradient(180deg, #ffb84a, #d67e0d);
  border:1px solid rgba(0,0,0,.12);
}
/* =========================
   REMOVE OUTER FRAME: Tổng quan lá số (tv_sec_overview)
   Dán ở CUỐI FILE
========================= */
#tuvi-laso-app #tv_sec_overview,
#tuvi-laso-app #tv_sec_overview.tv-i-section{
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

#tuvi-laso-app #tv_sec_overview::before,
#tuvi-laso-app #tv_sec_overview::after{
  content: none !important;
  display: none !important;
}

/* nếu section-head đang tạo thêm 1 lớp khung/line */
#tuvi-laso-app #tv_sec_overview .tv-i-section-head{
  display: none !important;
}

#tuvi-laso-app #tv_sec_overview .tv-i-section-body{
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
}
/* =========================
   REMOVE OUTER FRAME: Luận giải chi tiết các cung
   (section palaces)
   Dán ở CUỐI FILE
========================= */

/* section palaces thường có 1 trong các id/class sau */
#tuvi-laso-app :is(#tv_sec_palaces, #tv_sec_cung, #tv_sec_palace),
#tuvi-laso-app :is(#tv_sec_palaces, #tv_sec_cung, #tv_sec_palace).tv-i-section{
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* tắt pseudo-element nếu nó vẽ khung/halo */
#tuvi-laso-app :is(#tv_sec_palaces, #tv_sec_cung, #tv_sec_palace)::before,
#tuvi-laso-app :is(#tv_sec_palaces, #tv_sec_cung, #tv_sec_palace)::after{
  content: none !important;
  display: none !important;
}

/* phần head (tiêu đề + line vàng) nếu bạn muốn giữ thì COMMENT 2 block dưới
   còn nếu muốn bỏ luôn khung head thì để nguyên */
#tuvi-laso-app :is(#tv_sec_palaces, #tv_sec_cung, #tv_sec_palace) .tv-i-section-head{
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 0 12px !important;
  margin: 0 0 12px !important;
}

/* body không còn padding gây cảm giác “khung to” */
#tuvi-laso-app :is(#tv_sec_palaces, #tv_sec_cung, #tv_sec_palace) .tv-i-section-body{
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
}
#tuvi-laso-app .tv-lock-teaser{
  margin: 10px 0 12px;
  padding-left: 12px;
  border-left: 2px solid rgba(255,184,74,.75);
  color: rgba(235,240,255,.86);
  font-style: italic;
  line-height: 1.6;
}
/* =========================
   LOCK BOX: Ẩn phần "Luận giải tổng quan..." khi CHƯA mở
   Chỉ hiện khi .tv-lock có class .is-opened
========================= */
#tuvi-laso-app .tv-lock .tv-lock-open{
  display: none !important;
}

#tuvi-laso-app .tv-lock.is-opened .tv-lock-open{
  display: block !important;
}

#tuvi-laso-app .tv-lock.is-opened .tv-lock-form{
  display: none !important;
}

/* teaser (câu ngắn) bạn đã thêm -> giữ style gọn gàng */
#tuvi-laso-app .tv-lock-teaser{
  margin: 10px 0 12px;
  padding-left: 12px;
  border-left: 2px solid rgba(255,184,74,.75);
  color: rgba(235,240,255,.86);
  font-style: italic;
  line-height: 1.6;
}
/* =========================================================
   UI PURPLE PAY CARDS (12 cung + 2 mục) — giống ảnh mẫu
========================================================= */
#tuvi-laso-app #tv_sec_palaces .tv-pcard{
  margin: 18px 0 !important;
  border-radius: 26px !important;
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  background:
    radial-gradient(1200px 420px at 18% 25%, rgba(255,255,255,.06), transparent 60%),
    radial-gradient(900px 380px at 86% 75%, rgba(255,215,0,.10), transparent 60%),
    linear-gradient(90deg, #5b1b7b, #3a0f58) !important;
  box-shadow: 0 26px 80px rgba(0,0,0,.48) !important;
}

#tuvi-laso-app #tv_sec_palaces .tv-pcard-row{display:flex !important;align-items:stretch !important}
#tuvi-laso-app #tv_sec_palaces .tv-pcard-left{
  flex:0 0 320px;padding:28px !important;display:flex !important;flex-direction:column !important;justify-content:center !important
}
#tuvi-laso-app #tv_sec_palaces .tv-pcard-name{
  color:#fff !important;font-weight:950 !important;letter-spacing:.12em !important;text-transform:uppercase !important;
  font-size:26px !important;line-height:1.15 !important
}
#tuvi-laso-app #tv_sec_palaces .tv-pcard-price{color:#ffd34a !important;font-weight:950 !important;font-size:34px !important;margin-top:8px !important}

#tuvi-laso-app #tv_sec_palaces .tv-pcard-divider{
  width:1px;margin:22px 0;background:linear-gradient(180deg,transparent,rgba(255,255,255,.22),transparent);
  opacity:.95;flex:0 0 1px
}

#tuvi-laso-app #tv_sec_palaces .tv-pcard-right{
  flex:1 1 auto;padding:22px 26px !important;display:flex !important;flex-direction:column !important;
  justify-content:center !important;gap:16px !important
}

#tuvi-laso-app #tv_sec_palaces .tv-pcard-feats{
  list-style:none !important;margin:0 !important;padding:0 !important;display:grid !important;gap:12px !important
}
#tuvi-laso-app #tv_sec_palaces .tv-pcard-feats li{
  display:flex !important;gap:10px !important;align-items:flex-start !important;
  color:rgba(255,255,255,.92) !important;font-size:15px !important;line-height:1.5 !important
}
#tuvi-laso-app #tv_sec_palaces .tv-pcard-feats li::before{
  content:"✓";width:22px;height:22px;border-radius:999px;background:#ffd34a;color:#2a1340;font-weight:950;
  display:flex;align-items:center;justify-content:center;flex:0 0 22px;margin-top:2px;box-shadow:0 10px 22px rgba(0,0,0,.20)
}

#tuvi-laso-app #tv_sec_palaces .tv-pcard .tv-lock-form{
  display:flex !important;flex-direction:column !important;align-items:center !important;gap:8px !important
}
#tuvi-laso-app #tv_sec_palaces .tv-pcard-btn{
  height:50px !important;padding:0 40px !important;min-width:240px;border-radius:14px !important;
  border:1px solid rgba(0,0,0,.20) !important;background:linear-gradient(180deg,#ffd34a,#f0b100) !important;
  color:#24122e !important;font-weight:950 !important;letter-spacing:.10em !important;text-transform:uppercase !important;
  cursor:pointer !important;box-shadow:0 16px 34px rgba(0,0,0,.25) !important
}
#tuvi-laso-app #tv_sec_palaces .tv-pcard-btn:hover{filter:brightness(1.03);transform:translateY(-1px)}
#tuvi-laso-app #tv_sec_palaces .tv-pcard-btn:active{transform:translateY(0)}

#tuvi-laso-app #tv_sec_palaces .tv-pcard .tv-lock-msg{min-height:18px;font-size:13px;color:rgba(255,255,255,.84)}

@media (max-width: 860px){
  #tuvi-laso-app #tv_sec_palaces .tv-pcard-row{flex-direction:column !important}
  #tuvi-laso-app #tv_sec_palaces .tv-pcard-left{flex:0 0 auto !important;padding:22px 18px 10px !important}
  #tuvi-laso-app #tv_sec_palaces .tv-pcard-divider{width:auto !important;height:1px !important;margin:0 18px !important;
    background:linear-gradient(90deg,transparent,rgba(255,255,255,.22),transparent)}
  #tuvi-laso-app #tv_sec_palaces .tv-pcard-right{padding:14px 18px 18px !important}
  #tuvi-laso-app #tv_sec_palaces .tv-pcard-btn{width:100% !important;min-width:0 !important}
}
/* =========================
   PURPLE CARD COMPACT (desktop + mobile)
   Dán CUỐI app.css
========================= */

#tuvi-laso-app #tv_sec_palaces .tv-pcard{
  margin: 14px 0 !important;          /* giảm khoảng cách giữa các card */
  border-radius: 22px !important;     /* bớt bo tròn */
}

#tuvi-laso-app #tv_sec_palaces .tv-pcard-left{
  flex: 0 0 260px !important;         /* cột trái nhỏ lại (320 -> 260) */
  padding: 18px 18px !important;      /* giảm padding */
}

#tuvi-laso-app #tv_sec_palaces .tv-pcard-name{
  font-size: 22px !important;         /* nhỏ lại */
  letter-spacing: .10em !important;
}

#tuvi-laso-app #tv_sec_palaces .tv-pcard-price{
  font-size: 28px !important;         /* nhỏ lại */
  margin-top: 6px !important;
}

#tuvi-laso-app #tv_sec_palaces .tv-pcard-divider{
  margin: 14px 0 !important;          /* divider thấp hơn */
}

#tuvi-laso-app #tv_sec_palaces .tv-pcard-right{
  padding: 14px 16px !important;      /* giảm padding phải */
  gap: 10px !important;
}

#tuvi-laso-app #tv_sec_palaces .tv-pcard-feats{
  gap: 8px !important;                /* list sát hơn */
}

#tuvi-laso-app #tv_sec_palaces .tv-pcard-feats li{
  font-size: 14px !important;
  line-height: 1.35 !important;
}

#tuvi-laso-app #tv_sec_palaces .tv-pcard-feats li::before{
  width: 20px !important;
  height: 20px !important;
  flex: 0 0 20px !important;
  margin-top: 1px !important;
}

#tuvi-laso-app #tv_sec_palaces .tv-pcard-btn{
  height: 44px !important;            /* nút thấp hơn */
  padding: 0 28px !important;
  min-width: 200px !important;
  border-radius: 12px !important;
  letter-spacing: .08em !important;
}
@media (max-width: 860px){
  #tuvi-laso-app #tv_sec_palaces .tv-pcard-row{
    flex-direction: column !important;
  }

  #tuvi-laso-app #tv_sec_palaces .tv-pcard-left{
    flex: 0 0 auto !important;
    padding: 16px 16px 10px !important;
  }

  #tuvi-laso-app #tv_sec_palaces .tv-pcard-name{
    font-size: 18px !important;
    letter-spacing: .08em !important;
  }

  #tuvi-laso-app #tv_sec_palaces .tv-pcard-price{
    font-size: 24px !important;
  }

  #tuvi-laso-app #tv_sec_palaces .tv-pcard-divider{
    height: 1px !important;
    margin: 0 16px !important;
  }

  #tuvi-laso-app #tv_sec_palaces .tv-pcard-right{
    padding: 12px 16px 14px !important;
    gap: 10px !important;
  }

  #tuvi-laso-app #tv_sec_palaces .tv-pcard-btn{
    width: 100% !important;
    min-width: 0 !important;
    height: 46px !important;
  }
}
/* ===== Paywall head (59K) ===== */
#tuvi-laso-app .tv-paywall-head{ margin: 14px 0 12px; }
#tuvi-laso-app .tv-paywall-h1{
  font-weight: 950;
  font-size: 46px;
  line-height: 1.08;
  color: #111827;
  letter-spacing: .2px;
}
#tuvi-laso-app .tv-paywall-price-row{
  display:flex;
  align-items:center;
  gap: 14px;
  flex-wrap: wrap;
  margin-top: 10px;
}
#tuvi-laso-app .tv-paywall-price{
  font-size: 54px;
  font-weight: 950;
  color: #f97316;
  letter-spacing: .5px;
}
#tuvi-laso-app .tv-paywall-hot{
  padding: 10px 14px;
  border-radius: 14px;
  background: #fff1f2;
  border: 1px solid rgba(244,63,94,.25);
  color: #fb7185;
  font-weight: 900;
}

@media (max-width:720px){
  #tuvi-laso-app .tv-paywall-h1{ font-size: 30px; }
  #tuvi-laso-app .tv-paywall-price{ font-size: 40px; }
}

/* =========================================================
   FIX MOBILE 2026-03-23
   - Bỏ khoảng trống thừa dưới lá số trên điện thoại
   - Cho popup thanh toán cuộn đọc được trên mobile
========================================================= */
html.tv-unlock-open,
body.tv-unlock-open{
  overflow: hidden;
}

#tuvi-laso-app #tv_chart,
#tv_chart,
#tuvi-laso-app #tv_board_wrap,
#tv_board_wrap{
  min-height: 0 !important;
}

#tuvi-laso-app #tv_board_wrap,
#tv_board_wrap{
  padding-bottom: 0 !important;
}

.tvUnlockModal{
  padding: 12px;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}

.tvUnlockModal .tvum-card{
  position: relative;
  z-index: 1;
  width: min(780px, 100%);
  max-height: calc(100dvh - 24px);
  margin: 0 auto;
  display: flex;
  flex-direction: column;
}

.tvUnlockModal .tvum-body{
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}

@media (max-width: 768px){
  #tuvi-laso-app #tv_chart,
  #tv_chart{
    min-height: 0 !important;
    height: auto !important;
    align-items: flex-start !important;
  }

  #tuvi-laso-app #tv_board_wrap,
  #tv_board_wrap,
  .tv-board-wrap{
    min-height: 0 !important;
    padding: 8px !important;
  }

  .tvUnlockModal{
    padding: 10px;
    align-items: flex-start;
  }

  .tvUnlockModal .tvum-card{
    width: 100%;
    max-height: calc(100dvh - 20px);
  }

  .tvUnlockModal .tvum-body{
    padding: 14px;
  }

  .tvUnlockModal .tvum-help{
    max-height: none;
    overflow: visible;
  }
}