/* Trang «La bàn Bát Trạch» — dùng token màu của bộ CSS chung Viện (--lacquer, --gold, --paper…), mọi lớp mang tiền tố bt. */
.bt{--bt-tot:#C0392B;--bt-tot-nen:#FBEAE7;--bt-xau:#1D5FC4;--bt-xau-nen:#E5EEFB;--bt-truc-nen:#FFF1C9}
.bt .bt-luoi{display:grid;grid-template-columns:minmax(0,370px) minmax(0,1fr);gap:32px;align-items:start}
.bt .bt-the{background:var(--paper);border:1px solid var(--line);border-top:3px solid var(--lacquer);padding:28px 28px 26px;box-shadow:0 14px 34px rgba(31,20,16,.07)}
.bt h2{font-family:'Noto Serif',Georgia,serif;font-weight:600;color:var(--ink);margin:0}
.bt .bt-nhap h2{font-size:22px;margin-bottom:6px}
.bt .bt-nhap .mo-ta{font-size:14.5px;color:var(--mut);margin:0 0 20px;line-height:1.6}
.bt .truong{display:flex;flex-direction:column;gap:7px;margin-bottom:20px}
.bt label,.bt .nhan{font-size:12.5px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--lacquer)}
.bt .o-nhap{position:relative}
.bt input[type=text],.bt select{width:100%;font:inherit;font-size:18px;color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:2px;padding:12px 30px 12px 14px;min-height:50px}
.bt select{font-size:15px;padding-right:10px}
.bt input[aria-invalid="true"]{border-color:var(--bt-tot);background:#FFF8F6}
.bt .o-nhap .don-vi{position:absolute;right:12px;top:50%;transform:translateY(-50%);color:var(--mut);font-size:18px;pointer-events:none}
.bt input:focus-visible,.bt select:focus-visible,.bt button:focus-visible,.bt a:focus-visible{outline:2px solid var(--gold-bright);outline-offset:2px}
.bt .goi-y{font-size:13.5px;color:var(--mut);line-height:1.5}
.bt .bt-hai-o{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.bt .hoac{display:flex;align-items:center;gap:10px;font-size:12.5px;color:var(--mut);margin:-6px 0 12px}
.bt .hoac::before,.bt .hoac::after{content:"";flex:1;border-top:1px solid var(--line)}
.bt .bt-gioi{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border:1px solid var(--line);border-radius:2px;overflow:hidden;background:#fff}
.bt .bt-gioi label{position:relative;display:flex;align-items:center;justify-content:center;min-height:50px;cursor:pointer;font-size:15px;font-weight:500;letter-spacing:.02em;text-transform:none;color:var(--ink-2);transition:background .15s}
.bt .bt-gioi label+label{border-left:1px solid var(--line)}
.bt .bt-gioi label:hover{background:var(--bg-3)}
.bt .bt-gioi input{position:absolute;opacity:0;pointer-events:none}
.bt .bt-gioi label:has(input:checked){background:var(--lacquer);color:var(--cream)}
.bt .bt-gioi label:has(input:focus-visible){outline:2px solid var(--gold-bright);outline-offset:-2px}
.bt .nut-xem{width:100%;font:inherit;font-size:16px;font-weight:600;letter-spacing:.04em;color:var(--cream);background:linear-gradient(157deg,var(--lacquer-2),var(--lacquer) 55%,var(--lacquer-3));border:1px solid rgba(212,175,55,.35);padding:15px 18px;cursor:pointer;transition:transform .15s,box-shadow .15s}
.bt .nut-xem:hover{transform:translateY(-1px);box-shadow:0 10px 22px rgba(92,14,14,.25)}
.bt .loi{margin:14px 0 0;font-size:14px;color:var(--bt-tot)}
.bt .vi-du{margin:14px 0 0;font-size:13px;color:var(--mut);font-style:italic}

/* kết quả: Cung Phi + la bàn */
.bt .bt-ket-qua,.bt .bt-tam-huong{transition:opacity .2s}
.bt .bt-ket-qua.mo,.bt .bt-tam-huong.mo{opacity:.35}
.bt .bt-dau-kq{display:flex;gap:20px;align-items:center;padding-bottom:18px;border-bottom:1px solid var(--line)}
.bt .bt-o-cung{flex:none;width:104px;height:104px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(157deg,var(--lacquer-2),var(--lacquer) 55%,var(--lacquer-3));color:var(--cream);box-shadow:inset 0 0 0 1px rgba(212,175,55,.45)}
.bt .bt-o-cung span{font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-bright-2)}
.bt .bt-o-cung b{font-family:'Noto Serif',Georgia,serif;font-size:28px;line-height:1.15;color:#fff;font-weight:600}
.bt .bt-o-cung small{font-size:11px;color:var(--cream-2)}
.bt .bt-dau-kq h2{font-size:clamp(22px,3vw,28px);line-height:1.2}
.bt .bt-dau-kq p{margin:6px 0 0;font-size:15px;color:var(--body);line-height:1.6}
.bt .bt-khung-la-ban{margin:20px auto 0;max-width:580px}
.bt .bt-chu-giai{list-style:none;margin:14px 0 0;padding:14px 0 0;border-top:1px dashed var(--line);display:flex;flex-wrap:wrap;gap:8px 18px;font-size:13.5px;color:var(--mut)}
.bt .bt-chu-giai i{font-style:normal;font-weight:600;padding:0 5px}
.bt .cg-tot{color:var(--bt-tot);background:var(--bt-tot-nen)}.bt .cg-xau{color:var(--bt-xau);background:var(--bt-xau-nen)}
.bt .cg-son{color:var(--ink-2);background:var(--bt-truc-nen)}.bt .cg-truc{color:var(--bt-tot)}

/* la bàn SVG: đĩa xoay, chữ lật theo nửa màn hình (la-ban.js) */
.bt-la-ban{display:block;width:100%;height:auto;--bt-tot:#C0392B;--bt-xau:#1D5FC4}
.bt-la-ban .dia{transition:transform .9s cubic-bezier(.22,1,.36,1)}
.bt-la-ban text{text-anchor:middle;dominant-baseline:central}
.bt-la-ban .nen-do{fill:var(--paper)}
.bt-la-ban .vach{stroke:var(--ink-2);stroke-width:1}
.bt-la-ban .so-do{font:500 11px 'Be Vietnam Pro',sans-serif;fill:var(--ink-2)}
.bt-la-ban .moc-bac,.bt-la-ban .moc-huong{fill:var(--bt-tot)}
.bt-la-ban .o-son{fill:#fff;stroke:var(--line)}
.bt-la-ban .o-son.la-truc{fill:#FFF1C9}
.bt-la-ban .ten-son{font:500 14px 'Noto Serif',serif;fill:var(--body)}
.bt-la-ban .ten-son.chinh{font-weight:700;fill:var(--ink)}
.bt-la-ban .o-sao{stroke:var(--line)}
.bt-la-ban .o-sao.cat{fill:#FBEAE7}.bt-la-ban .o-sao.hung{fill:#E5EEFB}.bt-la-ban .o-sao.trong{fill:#F3ECDD}
.bt-la-ban .ten-sao{font:700 15px 'Noto Serif',serif}
.bt-la-ban .phu-sao{font:600 10.5px 'Be Vietnam Pro',sans-serif;letter-spacing:.12em}
.bt-la-ban text.cat{fill:var(--bt-tot)}.bt-la-ban text.hung{fill:var(--bt-xau)}
.bt-la-ban .o-quai{fill:var(--bg);stroke:var(--line)}
.bt-la-ban .ten-quai{font:700 15px 'Noto Serif',serif;fill:var(--lacquer)}
.bt-la-ban .phuong{font:500 10.5px 'Be Vietnam Pro',sans-serif;fill:var(--mut)}
.bt-la-ban .hao rect{fill:var(--ink-2)}
.bt-la-ban .tam{fill:var(--cream);stroke:var(--gold)}
.bt-la-ban .kim-bac{fill:var(--bt-tot)}.bt-la-ban .kim-nam{fill:var(--ink-2)}
.bt-la-ban .chot{fill:var(--gold-bright);stroke:var(--lacquer);stroke-width:1.5}
.bt-la-ban .vien{fill:none;stroke:var(--ink-2);stroke-width:1.2}
.bt-la-ban .truc{stroke:var(--bt-tot);stroke-width:1.8}
.bt-la-ban .truc-ngang{stroke:var(--bt-tot);stroke-width:1;opacity:.45}
.bt-la-ban .muc-truc{font:700 13px 'Be Vietnam Pro',sans-serif;letter-spacing:.16em;fill:var(--bt-tot)}
.bt-la-ban .muc-do{font:600 14px 'Be Vietnam Pro',sans-serif;fill:var(--ink)}

/* bảng tám hướng dưới công cụ */
.bt .bt-tam-huong{margin-top:40px}
.bt .bt-tam-huong h2{font-size:clamp(22px,2.6vw,26px);margin-bottom:6px}
.bt .bt-tam-huong>p{margin:0 0 16px;font-size:15px;color:var(--mut)}
.bt .bt-bang{width:100%;border-collapse:collapse;background:var(--paper);font-size:14.5px;line-height:1.5;font-variant-numeric:tabular-nums;margin:0}
.bt .bt-bang th,.bt .bt-bang td{border:1px solid var(--line);padding:10px 12px;text-align:left;vertical-align:top;color:var(--ink-2)}
.bt .bt-bang thead th{background:var(--bg-3);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--lacquer)}
.bt .bt-bang tbody th{font-weight:600;color:var(--ink);background:#FBF7EE}
.bt .bt-bang-huong td.sao b{font-family:'Noto Serif',Georgia,serif;font-size:16px}
.bt .bt-bang-huong tr.tot td.sao b{color:var(--bt-tot)}.bt .bt-bang-huong tr.xau td.sao b{color:var(--bt-xau)}
.bt .the-tot,.bt .the-xau{display:inline-block;font-size:12px;font-weight:700;letter-spacing:.04em;padding:2px 8px;border-radius:2px;white-space:nowrap}
.bt .the-tot{color:var(--bt-tot);background:var(--bt-tot-nen)}
.bt .the-xau{color:var(--bt-xau);background:var(--bt-xau-nen)}

/* trả lời nhanh ngay dưới công cụ: đoạn tự đứng được cho người đọc lướt và máy trả lời */
.bt-nhanh{padding-top:0}
.bt .bt-tra-loi{max-width:840px;margin:0 auto;background:var(--paper);border:1px solid var(--line);border-left:4px solid var(--gold-bright);padding:24px 28px}
.bt .bt-tra-loi h2{font-size:clamp(21px,2.4vw,24px);margin-bottom:10px}
.bt .bt-tra-loi p{margin:0 0 12px;font-size:15.5px;line-height:1.75;color:var(--body)}
.bt .bt-tra-loi .bt-ky{margin:14px 0 0;padding-top:12px;border-top:1px dashed var(--line);font-size:13.5px;color:var(--mut)}

/* phần bài dưới công cụ */
.bt-bai .s-head{text-align:center;margin-bottom:40px}
.bt .bt-buoc{list-style:none;counter-reset:buoc;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.bt .bt-buoc li{counter-increment:buoc;position:relative;background:var(--paper);border:1px solid var(--line);border-top:3px solid var(--lacquer);padding:62px 24px 24px}
.bt .bt-buoc li::before{content:counter(buoc);position:absolute;top:18px;left:24px;font-family:'Noto Serif',Georgia,serif;font-size:32px;font-weight:600;line-height:1;color:var(--lacquer)}
.bt .bt-buoc b{display:block;font-family:'Noto Serif',Georgia,serif;font-size:19px;font-weight:600;color:var(--ink);margin-bottom:8px}
.bt .bt-buoc p{margin:0;font-size:15px;line-height:1.7;color:var(--body)}
.bt .bt-hai-cot{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;align-items:start}
.bt .bt-sao{margin:0;display:flex;flex-direction:column;gap:12px}
.bt .bt-sao div{background:var(--paper);border:1px solid var(--line);border-left:4px solid var(--bt-tot);padding:12px 16px}
.bt .bt-sao div.xau{border-left-color:var(--bt-xau)}
.bt .bt-sao dt{font-family:'Noto Serif',Georgia,serif;font-weight:700;font-size:16px;color:var(--bt-tot);margin-bottom:2px}
.bt .bt-sao .xau dt{color:var(--bt-xau)}
.bt .bt-sao dt span{font-family:'Be Vietnam Pro',sans-serif;font-size:12px;font-weight:600;letter-spacing:.06em;color:var(--mut);margin-left:6px}
.bt .bt-sao dd{margin:0;font-size:14.5px;line-height:1.6;color:var(--body)}
.bt .bt-ghi-nhom{max-width:840px;margin:28px auto 0;text-align:center;font-size:15.5px;line-height:1.75;color:var(--body)}
.bt .bt-cuon{max-width:980px;margin:0 auto;overflow-x:auto}
.bt .bt-bang-cung td{line-height:1.75}
.bt .bt-bang-cung td.tot{color:var(--bt-tot)}.bt .bt-bang-cung td.xau{color:var(--bt-xau)}
.bt .bt-bang-cung tbody th{white-space:nowrap}
.bt .bt-ba-bang{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;align-items:start}
.bt .bt-bang-nam th,.bt .bt-bang-nam td{padding:7px 12px}
.bt .faq-list{max-width:840px;margin:0 auto;display:flex;flex-direction:column}
.bt .faq-item{background:var(--paper);border:1px solid var(--line);border-bottom-width:0}
.bt .faq-item:last-child{border-bottom-width:1px}
.bt .faq-item summary{list-style:none;padding:18px 22px;cursor:pointer;font-family:'Noto Serif',Georgia,serif;font-size:16px;color:var(--ink);font-weight:600;display:flex;justify-content:space-between;align-items:center;gap:16px}
.bt .faq-item summary::-webkit-details-marker{display:none}
.bt .faq-item summary::after{content:"+";color:var(--gold);font-size:22px;font-weight:500}
.bt .faq-item[open] summary::after{content:"−"}
.bt .faq-item[open] summary{color:var(--lacquer);border-bottom:1px dashed var(--line)}
.bt .faq-item .answer{padding:14px 22px 20px;font-size:15px;color:var(--body);line-height:1.8}
.bt .faq-item .answer p{margin:0}
.bt .faq-item a{color:var(--lacquer);font-weight:600;text-decoration:underline}

/* dải mời liên hệ */
.bt-cta{background:linear-gradient(157deg,#6A141A,var(--lacquer) 50%,var(--lacquer-3));color:var(--cream);padding:56px 0}
.bt-cta .wrap{display:flex;gap:32px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.bt-cta h2{font-family:'Noto Serif',Georgia,serif;font-size:clamp(24px,3vw,32px);font-weight:600;color:#fff;margin:0 0 8px}
.bt-cta h2 em{color:var(--gold-bright-2)}
.bt-cta p{margin:0;max-width:60ch;color:var(--cream-2);font-size:16px;line-height:1.65}
.bt-cta .hang-nut{display:flex;flex-wrap:wrap;gap:12px}
.bt-cta .nut{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:12px 24px;font-weight:600;letter-spacing:.03em;border:1px solid var(--gold-bright)}
.bt-cta .nut-chinh{background:var(--gold-bright);color:var(--lacquer-3)}
.bt-cta .nut-chinh:hover{background:var(--gold-bright-2);color:var(--lacquer-3)}
.bt-cta .nut-phu{color:var(--gold-bright-2)}
.bt-cta .nut-phu:hover{background:rgba(232,199,107,.12);color:#fff}

@media (min-width:901px){.bt .bt-nhap{position:sticky;top:96px}}
@media (max-width:900px){
  .bt .bt-tra-loi{padding:20px 18px}
  .bt .bt-luoi{grid-template-columns:minmax(0,1fr);gap:22px}
  .bt .bt-the{padding:22px 18px}
  .bt .bt-buoc{grid-template-columns:minmax(0,1fr);gap:16px}
  .bt .bt-hai-cot{grid-template-columns:minmax(0,1fr);gap:12px}
  .bt .bt-ba-bang{grid-template-columns:minmax(0,1fr);gap:16px}
}
@media (max-width:640px){
  #bt>.wrap{padding-left:14px;padding-right:14px}
  .bt .bt-dau-kq{gap:14px}
  .bt .bt-o-cung{width:84px;height:84px}
  .bt .bt-o-cung b{font-size:22px}
  .bt .bt-khung-la-ban{margin-left:-14px;margin-right:-14px}
  .bt-la-ban .so-do{font-size:15px}.bt-la-ban .ten-son{font-size:20px}.bt-la-ban .ten-sao{font-size:20px}.bt-la-ban .phu-sao{font-size:13px}
  .bt-la-ban .ten-quai{font-size:20px}.bt-la-ban .phuong{font-size:14px}.bt-la-ban .muc-truc{font-size:17px}.bt-la-ban .muc-do{font-size:19px}
  .bt .bt-bang-cung{font-size:13.5px}
  .bt .bt-bang-cung th,.bt .bt-bang-cung td{padding:8px 9px}
  .bt .bt-bang-huong thead{display:none}
  .bt .bt-bang-huong,.bt .bt-bang-huong tbody,.bt .bt-bang-huong tr,.bt .bt-bang-huong td{display:block;width:100%}
  .bt .bt-bang-huong tr{border:1px solid var(--line);margin-bottom:10px;background:var(--paper)}
  .bt .bt-bang-huong td{border:0;padding:4px 14px}
  .bt .bt-bang-huong td.sao{padding-top:12px}
  .bt .bt-bang-huong td:last-child{padding-bottom:12px}
  .bt .bt-bang-huong td[data-nhan]::before{content:attr(data-nhan) ": ";color:var(--mut);font-size:13px}
}
@media (prefers-reduced-motion:reduce){.bt .nut-xem,.bt .bt-ket-qua,.bt .bt-tam-huong,.bt-la-ban .dia{transition:none}}