/* ============================================================
   SINH TRẮC TAM TƯỚNG · thayungkhiem.vn/sinh-trac/
   © 2026 UK MASTER CORP · Thầy Ưng Khiêm
   Luật nhà: cát đỏ son, hung đen xám, không emoji, không gạch ngang dài.
   Màu ngũ hành lấy đúng bảng nhà (--h-kim ... --h-tho).
   ============================================================ */
:root:root:root{
  --son:#B3121B;--son2:#8C1F14;--tham:#6E0E0A;--tham2:#4A0D08;--kem:#FBEEC3;--kem2:#FFFDF6;
  --giay:#FDF9EF;--vien:#E7D9B8;--chu:#241A12;--nhat:#6F604A;--vang:#D4AF37;--dong:#B8862F;
  --hung:#24211C;--xam:#6B6660;--da:#F3DCC0;--dav:#8A5A34;--muc:#3B2A1C;
  --h-kim:#5B6673;--h-kim2:#C9D2DB;--h-moc:#2F7248;--h-moc2:#7FC79A;--h-thuy:#2E6DA4;--h-thuy2:#8FC0E6;
  --h-hoa:#C0392B;--h-hoa2:#E88A72;--h-tho:#8A6318;--h-tho2:#EBCE7E;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--giay);color:var(--chu);line-height:1.68;
  font-family:"Be Vietnam Pro","Segoe UI",Arial,sans-serif;font-size:16px}
img,svg{max-width:100%}
a{color:var(--tham)}
.uk-ico{width:1em;height:1em;display:inline-block;vertical-align:-.12em;flex:none}
[hidden]{display:none!important}

/* ── song ngữ: .v tiếng Việt, .e tiếng Anh ── */
html.en .v{display:none!important}
html:not(.en) .e{display:none!important}

.st-wrap{max-width:1120px;margin:0 auto;padding:0 18px}
section{padding:54px 0;scroll-margin-top:64px}
section.alt{background:var(--kem2);border-top:1px solid var(--vien);border-bottom:1px solid var(--vien)}
h2{font-family:"Noto Serif",Georgia,serif;color:var(--tham);text-align:center;
  font-size:clamp(1.4rem,3.2vw,1.95rem);margin:0 0 10px;line-height:1.32}
h3{font-family:"Noto Serif",Georgia,serif;color:var(--tham);font-size:1.18rem;margin:26px 0 8px;line-height:1.4}
h4{font-size:1rem;margin:14px 0 6px;color:var(--tham2)}
.st-lead{text-align:center;color:#5B4636;max-width:800px;margin:0 auto 30px}
.st-kicker{display:block;text-align:center;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--dong);font-weight:800;margin-bottom:6px}
.han{font-family:"Noto Serif TC","Noto Serif",serif}
.st-note{font-size:.88rem;color:var(--nhat)}

/* ── thanh trên (29/09/2026): hàng 1 dấu Viện cuộn đi, hàng 2 menu dự án luôn dính ── */
.st-top{position:sticky;top:-60px;z-index:50;background:rgba(253,249,239,.97);backdrop-filter:blur(8px);border-bottom:1px solid var(--vien)}
.st-hang1 .st-wrap{display:flex;align-items:center;gap:14px;height:60px;overflow:hidden}
.st-brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--chu);min-width:0}
.st-brand img{width:38px;height:38px;border-radius:8px;flex:none}
.st-brand>span{min-width:0}
.st-brand .st-vien-chu{display:block;font-style:normal;font-size:.64rem;font-weight:800;letter-spacing:.16em;color:var(--son);line-height:1.25;white-space:nowrap}
.st-brand b{font-size:.86rem;letter-spacing:.06em;display:block;line-height:1.2;white-space:nowrap}
.st-brand small{display:block;color:var(--nhat);font-size:.72rem;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.st-vien-link{margin-left:auto;text-align:right;font-size:.74rem;color:var(--nhat);text-decoration:none;line-height:1.35}
.st-hang1 .ukma-lang{margin-left:14px}
.st-vien-link b{display:block;color:var(--tham);letter-spacing:.14em;font-size:.8rem}
.st-vien-link:hover b{color:var(--son)}
.st-hang2{border-top:1px solid var(--vien)}
.st-hang2 .st-wrap{display:flex;align-items:center;gap:10px;height:46px}
.st-menu{display:flex;align-items:center;gap:2px;flex:1;min-width:0;height:100%;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.st-menu::-webkit-scrollbar{display:none}
/* mép mờ báo hàng menu còn cuộn được, chỉ bật khi hàng dài hơn màn hình (bai-viet.js, sinh-trac.js gắn lớp) */
.st-menu.cuon{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 18px,#000 calc(100% - 26px),transparent);mask-image:linear-gradient(90deg,transparent 0,#000 18px,#000 calc(100% - 26px),transparent)}
.st-menu>a,.st-bai>summary{white-space:nowrap;text-decoration:none;color:var(--tham);font-size:.86rem;font-weight:700;padding:7px 11px;border-radius:999px;cursor:pointer;flex:none;line-height:1.2}
.st-menu>a:hover,.st-bai>summary:hover{background:var(--kem)}
.st-menu>a[aria-current],.st-bai>summary.on,.st-bai[open]>summary{background:var(--tham);color:var(--kem)}
.st-menu>a.st-m-goi{color:var(--son)}
.st-bai{flex:none}
.st-bai>summary{list-style:none;display:inline-flex;align-items:center;gap:6px}
.st-bai>summary::-webkit-details-marker{display:none}
.st-bai>summary::after{content:"";width:6px;height:6px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-2px) rotate(45deg)}
.st-bai[open]>summary::after{transform:translateY(2px) rotate(-135deg)}
.st-bai>summary em{font-style:normal;font-size:.7rem;background:var(--son);color:#fff;border-radius:999px;padding:1px 7px}
/* bảng bài: bám theo .st-top chứ không theo hàng menu cuộn ngang, nên không bị cắt */
.st-bai-ds{position:absolute;left:0;right:0;top:100%;background:#FFFCF4;border-top:1px solid var(--vien);border-bottom:2px solid var(--dong);box-shadow:0 18px 30px rgba(46,6,3,.16);padding:14px 0 16px;max-height:70vh;overflow:auto}
.st-hang2 .st-bai-ds .st-wrap{display:block;height:auto}
.st-bai-ds .t{margin:0 0 10px;font-size:.74rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--dong)}
.st-bai-ds ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:8px}
.st-bai-ds li a{display:block;background:#fff;border:1px solid var(--vien);border-radius:12px;padding:10px 12px;text-decoration:none;color:var(--chu);line-height:1.35}
.st-bai-ds li a:hover{border-color:var(--son)}
.st-bai-ds li a b{display:block;color:var(--tham);font-size:.92rem}
.st-bai-ds li a small{color:var(--nhat);font-size:.78rem}
.st-bai-ds li a[aria-current]{border-color:var(--son);background:#FFF6F3}
.st-bai-ds .tat-ca{display:inline-block;margin-top:12px;color:var(--son2);font-weight:700;font-size:.86rem}
.ukma-lang{display:inline-flex;align-items:center;border:1px solid var(--vien);border-radius:999px;overflow:hidden;background:#fff;flex:none}
.ukma-lang button{border:0;background:none;color:var(--nhat);font:700 11.5px/1 "Be Vietnam Pro",sans-serif;padding:6px 10px;cursor:pointer;white-space:nowrap}
.ukma-lang button.on{background:var(--tham);color:var(--kem)}
@media(max-width:760px){.st-vien-link{display:none}.st-hang1 .ukma-lang{margin-left:auto}}
@media(max-width:420px){.st-hang2 .st-wrap{padding:0 10px 0 8px;gap:6px}.st-menu>a,.st-bai>summary{padding:7px 9px;font-size:.84rem}.ukma-lang button{padding:6px 8px}.ukma-lang .co{display:none}}
.ukma-lang .co{font-style:normal}

/* ── dấu Viện: nhãn trên tiêu đề, khối giới thiệu, thư viện bài ── */
.st-vien-nhan{display:inline-flex;max-width:100%;align-items:center;gap:8px;margin:0 0 14px;padding:5px 13px 5px 9px;border:1px solid rgba(255,215,106,.55);border-radius:999px;color:#FFE7A8;font-size:.76rem;font-weight:700;letter-spacing:.05em;text-decoration:none;background:rgba(0,0,0,.18);line-height:1.3}
.st-vien-nhan::before{content:"";width:8px;height:8px;border-radius:50%;background:#FFD76A;box-shadow:0 0 0 3px rgba(255,215,106,.25);flex:none}
.st-vien-nhan:hover{border-color:#FFD76A;color:#fff}
.st-vien-khoi{display:flex;gap:16px;align-items:flex-start;background:#fff;border:1.5px solid var(--dong);border-radius:16px;padding:18px;margin:26px auto 0;max-width:860px;text-align:left}
.st-vien-khoi img{width:64px;height:64px;border-radius:12px;flex:none}
.st-vien-khoi .t{display:block;font-family:"Noto Serif",Georgia,serif;color:var(--tham);font-size:1.05rem;margin-bottom:6px}
.st-vien-khoi p{margin:0 0 10px;font-size:.94rem}
.st-vien-khoi a{color:var(--son2);font-weight:700}
.st-bv-luoi{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,440px));justify-content:center;gap:14px}
.st-bv-the{display:flex;gap:14px;align-items:flex-start;background:#fff;border:1px solid var(--vien);border-radius:16px;padding:14px 16px;text-decoration:none;color:var(--chu);text-align:left}
.st-bv-the:hover{border-color:var(--son)}
.st-bv-the svg{flex:none}
.st-bv-the b{display:block;color:var(--tham);font-family:"Noto Serif",Georgia,serif;font-size:1.02rem;margin-bottom:4px}
.st-bv-the small{display:block;font-size:.86rem;color:#5B4636;line-height:1.45}
.st-bv-the i{display:inline-block;margin-top:6px;font-style:normal;font-size:.76rem;color:var(--dong);font-weight:700}
@media(max-width:520px){.st-vien-khoi{flex-direction:column;gap:10px}.st-bv-luoi{grid-template-columns:minmax(0,1fr)}}

/* ── đầu trang ── */
.st-hero{background:radial-gradient(ellipse at 22% 0%,#80140F 0%,var(--tham) 50%,#2E0603 100%);color:var(--kem);
  padding:48px 0 44px;position:relative;overflow:hidden}
/* 29/09/2026: bỏ chữ Hán làm nền, thay bằng vòng vân tay chìm */
.st-hero::before{content:"";position:absolute;right:-60px;top:-90px;width:440px;height:550px;background:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 500'><g fill='none' stroke='%23FFD76A' stroke-width='3' opacity='.07'><ellipse cx='200' cy='251' rx='19' ry='23'/><ellipse cx='200' cy='252' rx='38' ry='46'/><ellipse cx='200' cy='254' rx='57' ry='69'/><ellipse cx='200' cy='255' rx='76' ry='92'/><ellipse cx='200' cy='256' rx='95' ry='115'/><ellipse cx='200' cy='257' rx='114' ry='138'/><ellipse cx='200' cy='258' rx='133' ry='161'/><ellipse cx='200' cy='260' rx='152' ry='184'/><ellipse cx='200' cy='261' rx='171' ry='207'/></g></svg>") no-repeat center/contain;pointer-events:none}
.st-hero .st-wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:34px;align-items:center;position:relative}
.st-hero h1{font-family:"Noto Serif",Georgia,serif;color:var(--kem);margin:0 0 14px;font-size:clamp(1.7rem,4.2vw,2.75rem);line-height:1.22}
.st-hero h1 b{color:#FFD76A;font-weight:700}
.st-hero .sub{font-size:clamp(1rem,2.1vw,1.12rem);color:#EAD7A4;margin:0 0 22px;max-width:620px}
.st-cta{display:flex;gap:12px;flex-wrap:wrap}
.st-nut{display:inline-flex;align-items:center;gap:8px;background:linear-gradient(135deg,#FFD76A,#C8963E);color:#2A1606;
  font-weight:800;font-size:1rem;padding:14px 26px;border-radius:12px;border:none;cursor:pointer;text-decoration:none;
  box-shadow:0 8px 22px rgba(0,0,0,.25);font-family:inherit}
.st-nut.ghost{background:transparent;color:#FFD76A;border:2px solid rgba(212,175,55,.65);box-shadow:none}
.st-nut.son{background:var(--son);color:var(--kem);box-shadow:0 6px 16px rgba(179,18,27,.25)}
.st-nut.vien{background:#fff;color:var(--tham);border:1.5px solid var(--vien);box-shadow:none}
.st-nut:disabled{opacity:.5;cursor:not-allowed}
.st-diem{display:flex;gap:8px;flex-wrap:wrap;margin-top:22px}
.st-diem > span{background:rgba(255,255,255,.07);border:1px solid rgba(212,175,55,.3);border-radius:10px;padding:7px 12px;font-size:.85rem;color:#EAD7A4}
.st-diem b{color:#FFD76A}
.st-bento{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto auto;gap:12px}
.st-bento .o{background:rgba(253,249,239,.96);border-radius:16px;padding:12px;color:var(--chu);text-align:center;
  border:1px solid rgba(212,175,55,.5)}
.st-bento .o.lon{grid-row:span 2;display:flex;flex-direction:column;justify-content:center}
.st-bento .o svg{display:block;margin:0 auto;height:auto}
.st-bento .o b{display:block;font-family:"Noto Serif",serif;color:var(--tham);font-size:.95rem;margin-top:4px}
.st-bento .o small{color:var(--nhat);font-size:.76rem}
@media(max-width:860px){.st-hero .st-wrap{grid-template-columns:1fr}.st-bento{max-width:460px;margin:0 auto;width:100%}}

/* ── GEO ── */
.tcbt-geo{max-width:900px;margin:0 auto;background:#fff;border:1px solid var(--vien);border-left:4px solid var(--son);
  border-radius:12px;padding:16px 20px}
.tcbt-geo p{margin:6px 0;font-size:.95rem}

/* ── thẻ chung ── */
.st-luoi{display:grid;gap:16px}
.st-luoi.c2{grid-template-columns:repeat(2,minmax(0,1fr))}
.st-luoi.c3{grid-template-columns:repeat(3,minmax(0,1fr))}
.st-luoi.c4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:900px){.st-luoi.c4{grid-template-columns:repeat(2,minmax(0,1fr))}.st-luoi.c3{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.st-luoi.c2,.st-luoi.c3{grid-template-columns:1fr}}
@media(max-width:420px){.st-luoi.c4{grid-template-columns:1fr 1fr}}
.the{background:#fff;border:1px solid var(--vien);border-radius:16px;padding:18px}
.the h3{margin-top:0}
.the p{margin:.4em 0}
.nhan{display:inline-block;background:var(--kem);color:var(--tham);border-radius:7px;padding:2px 9px;font-size:.78rem;font-weight:700}
.hop-that{background:#fff;border:1.5px solid var(--hung);border-radius:14px;padding:16px 18px;margin:22px 0}
.hop-that b.t{display:block;color:var(--hung);margin-bottom:4px}
.hop-cat{background:#FFF6F3;border:1.5px solid var(--son);border-radius:14px;padding:16px 18px;margin:22px 0}
.hop-cat b.t{display:block;color:var(--son);margin-bottom:4px}
figure{margin:0}
figcaption{font-size:.85rem;color:var(--nhat);text-align:center;margin-top:6px}

/* ── bảng ── */
.bang-cuon{overflow-x:auto;border:1px solid var(--vien);border-radius:12px;background:#fff}
table{border-collapse:collapse;width:100%;font-size:.92rem}
caption{caption-side:top;text-align:left;font-weight:700;color:var(--tham);padding:10px 12px 4px}
th,td{padding:8px 12px;border-bottom:1px solid #F0E6CF;text-align:left;vertical-align:top}
thead th{background:var(--kem2);color:var(--tham2);font-size:.84rem}

/* ── dải trục bất biến ── */
.truc svg{width:100%;max-width:920px;height:auto;display:block;margin:0 auto}

/* ── tám dạng vân ── */
.van-o{background:#fff;border:1px solid var(--vien);border-radius:14px;padding:12px;text-align:center}
.van-o svg{width:100%;max-width:150px;height:auto;display:block;margin:0 auto}
.van-o b{display:block;color:var(--tham);font-size:.95rem;margin-top:6px}
.van-o small{display:block;color:var(--nhat);font-size:.78rem;line-height:1.4}
.van-o .ty{display:inline-block;margin-top:5px;font-size:.74rem;background:var(--kem2);border:1px solid var(--vien);border-radius:6px;padding:1px 7px;color:var(--tham2)}
.nhom-van{display:flex;align-items:baseline;gap:10px;margin:26px 0 10px;flex-wrap:wrap}
.nhom-van h3{margin:0}

/* ── sơ đồ tương tác ── */
.sd{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:22px;align-items:start}
@media(max-width:820px){.sd{grid-template-columns:1fr}}
.sd-hinh{background:#fff;border:1px solid var(--vien);border-radius:18px;padding:12px;position:relative}
.sd-hinh svg{display:block;width:100%;height:auto;touch-action:manipulation}
.sd-tab{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 12px}
.sd-tab button{border:1.5px solid var(--vien);background:#fff;color:var(--tham);border-radius:999px;padding:7px 13px;
  font:700 .84rem/1 "Be Vietnam Pro",sans-serif;cursor:pointer}
.sd-tab button.on{background:var(--tham);border-color:var(--tham);color:var(--kem)}
.sd-bang{background:#fff;border:1px solid var(--vien);border-radius:18px;padding:16px 18px;min-height:200px}
.sd-bang h3{margin-top:0}
.sd-ds{list-style:none;padding:0;margin:10px 0 0;display:grid;gap:6px}
.sd-ds button{width:100%;text-align:left;display:flex;gap:10px;align-items:flex-start;border:1px solid #F0E6CF;background:var(--kem2);
  border-radius:10px;padding:8px 10px;cursor:pointer;font:inherit;color:inherit}
.sd-ds button.on{border-color:var(--son);background:#FFF3EF}
.sd-ds .so{flex:none;min-width:28px;height:24px;border-radius:7px;background:var(--tham);color:var(--kem);font-weight:800;font-size:.78rem;
  display:inline-flex;align-items:center;justify-content:center;padding:0 5px}
.sd-ds small{display:block;color:var(--nhat);font-size:.82rem;line-height:1.45}
.diem{cursor:pointer}
.diem circle{transition:r .15s}
.diem.on circle.c{fill:var(--son)}
.diem.on rect,.diem.on circle:not(.c){stroke:var(--son);stroke-width:3}
.diem:focus{outline:none}
.duong{cursor:pointer}
.duong path.v1{fill:none;stroke-linecap:round;transition:stroke-width .15s,opacity .15s}
.duong.on path.v1{stroke-width:7!important}
.mo path.v1{opacity:.28}
.mo .duong.on path.v1{opacity:1}

/* ── tìm lưu niên ── */
.ln-tim{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end;margin:6px 0 12px}
.ln-tim label{font-size:.84rem;font-weight:700;color:var(--tham2);display:block;margin-bottom:4px}
.ln-tim input,.ln-tim select,.fo input,.fo select,.fo textarea{font:inherit;border:1.5px solid var(--vien);border-radius:10px;padding:9px 11px;background:#fff;color:var(--chu);width:100%}
.ln-tim input{width:120px}
.ln-kq{background:var(--kem2);border:1px solid var(--vien);border-radius:12px;padding:12px 14px}
.ln-kq b.to{font-family:"Noto Serif",serif;color:var(--son);font-size:1.25rem}
.ln-10{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.ln-10 button{border:1px solid var(--vien);background:#fff;border-radius:8px;padding:4px 8px;font:600 .8rem/1.3 "Be Vietnam Pro",sans-serif;cursor:pointer;color:var(--tham2)}
.ln-10 button.on{background:var(--son);color:#fff;border-color:var(--son)}

/* ── ngũ hành dáng tay ── */
.nh-o{background:#fff;border:1px solid var(--vien);border-radius:14px;padding:12px;text-align:center}
.nh-o svg{width:100%;max-width:130px;height:auto;display:block;margin:0 auto}
.nh-o b{display:block;font-size:1rem;margin-top:4px}
.nh-o small{display:block;color:var(--nhat);font-size:.8rem;line-height:1.45}

/* ── quy trình ── */
.qt{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;counter-reset:qt}
@media(max-width:820px){.qt{grid-template-columns:1fr 1fr}}
@media(max-width:440px){.qt{grid-template-columns:1fr}}
.qt li{list-style:none;background:#fff;border:1px solid var(--vien);border-radius:14px;padding:16px;position:relative}
.qt li::before{counter-increment:qt;content:counter(qt);position:absolute;top:-12px;left:14px;background:var(--son);color:#fff;
  font-weight:800;width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.9rem}
.qt b{display:block;color:var(--tham);margin:6px 0 2px}
.qt small{color:var(--nhat);font-size:.86rem}

/* ── hướng dẫn chụp ── */
.hd-o{background:#fff;border:1px solid var(--vien);border-radius:16px;padding:14px}
.hd-o svg{width:100%;height:auto;display:block}
.hd-o h3{margin:8px 0 4px;font-size:1.05rem}
.hd-o ul{margin:6px 0 0;padding-left:18px;font-size:.9rem}
.dung-sai{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:14px}
@media(max-width:620px){.dung-sai{grid-template-columns:1fr 1fr}}
.dung-sai figure{background:#fff;border:1px solid var(--vien);border-radius:12px;padding:8px}
.dung-sai figcaption{font-weight:700}
.dung-sai .ok figcaption{color:var(--son)}
.dung-sai .ko figcaption{color:var(--hung)}

/* ── ỨNG DỤNG CHỤP ── */
.app{background:#fff;border:1.5px solid var(--vien);border-radius:20px;overflow:hidden;box-shadow:0 14px 40px rgba(74,13,8,.08)}
.app-dau{background:linear-gradient(90deg,var(--tham),#8C1F14);color:var(--kem);padding:14px 18px;display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.app-dau b{font-family:"Noto Serif",serif;font-size:1.05rem}
.app-buoc{display:flex;gap:4px;margin-left:auto;flex-wrap:wrap}
.app-buoc span{font-size:.74rem;padding:4px 9px;border-radius:999px;background:rgba(255,255,255,.1);color:#EAD7A4;white-space:nowrap}
.app-buoc span.on{background:#FFD76A;color:#2A1606;font-weight:800}
.app-buoc span.xong{background:rgba(255,215,106,.25);color:#fff}
.app-than{padding:20px 18px}
.app-chan{display:flex;gap:10px;justify-content:space-between;padding:14px 18px;border-top:1px solid var(--vien);background:var(--kem2);flex-wrap:wrap}
.tien{height:6px;background:#F1E6CC;border-radius:999px;overflow:hidden;margin:4px 0 16px}
.tien i{display:block;height:100%;background:linear-gradient(90deg,var(--son),var(--dong));width:0;transition:width .3s}
.dong-y{display:flex;gap:10px;align-items:flex-start;background:var(--kem2);border:1px solid var(--vien);border-radius:12px;padding:12px;margin:10px 0}
.dong-y input{width:20px;height:20px;margin-top:3px;flex:none;accent-color:var(--son)}
.fo{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.fo.c2{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:620px){.fo,.fo.c2{grid-template-columns:1fr}}
.fo label{display:block;font-size:.84rem;font-weight:700;color:var(--tham2);margin-bottom:4px}
.o-chup{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
@media(max-width:760px){.o-chup{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:420px){.o-chup{grid-template-columns:repeat(2,minmax(0,1fr))}}
.o-chup.c3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:560px){.o-chup.c3{grid-template-columns:repeat(2,minmax(0,1fr))}}
.khe{border:1.5px dashed #D9C79C;border-radius:14px;background:var(--kem2);padding:8px;text-align:center;position:relative;display:flex;flex-direction:column;gap:6px}
.khe.co{border-style:solid;border-color:var(--vien);background:#fff}
.khe.dat{border-color:var(--son)}
.khe.mo{border-color:var(--hung)}
.khe .ten{font-size:.8rem;font-weight:800;color:var(--tham2);line-height:1.25}
.khe .ten small{display:block;font-weight:600;color:var(--nhat);font-size:.72rem}
.khe .anh{aspect-ratio:4/5;border-radius:10px;overflow:hidden;background:#F6EEDC;display:flex;align-items:center;justify-content:center}
.khe .anh img{width:100%;height:100%;object-fit:cover}
.khe .anh svg{width:62%;height:auto;opacity:.55}
.khe label.chon{display:block;cursor:pointer;background:var(--tham);color:var(--kem);border-radius:9px;padding:7px 6px;font-size:.78rem;font-weight:700}
.khe label.chon:focus-within{outline:3px solid var(--vang)}
.khe input[type=file]{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden}
.khe .dg{font-size:.72rem;font-weight:700;border-radius:6px;padding:2px 6px}
.khe .dg.dat{color:var(--son);background:#FFF1EC}
.khe .dg.tam{color:var(--tham2);background:var(--kem)}
.khe .dg.mo{color:#fff;background:var(--hung)}
.khe select{font:600 .76rem/1.2 "Be Vietnam Pro",sans-serif;border:1px solid var(--vien);border-radius:8px;padding:5px 4px;background:#fff;color:var(--chu);width:100%}
.tay-h{display:flex;align-items:center;gap:8px;margin:14px 0 8px;font-weight:800;color:var(--tham)}
.chon-van{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin-top:4px}
.chon-van button{border:1px solid var(--vien);background:#fff;border-radius:8px;padding:3px;cursor:pointer}
.chon-van button.on{border:2px solid var(--son);background:#FFF3EF}
.chon-van svg{width:100%;height:auto;display:block}
.xt{display:grid;grid-template-columns:1.1fr .9fr;gap:18px}
@media(max-width:760px){.xt{grid-template-columns:1fr}}
.xt-so{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.xt-so div{background:var(--kem2);border:1px solid var(--vien);border-radius:12px;padding:10px;text-align:center}
.xt-so b{display:block;font-family:"Noto Serif",serif;font-size:1.6rem;color:var(--tham)}
.xt-so small{font-size:.76rem;color:var(--nhat)}
.cot{display:flex;align-items:flex-end;gap:14px;height:170px;padding:10px 6px 0;margin-top:12px;border-bottom:1.5px solid var(--vien);overflow:hidden}
.cot div{flex:1;text-align:center;font-size:.78rem;color:var(--nhat)}
.cot i{display:block;background:var(--tham);border-radius:8px 8px 0 0;margin:0 auto 4px;width:70%;min-height:2px}
.ban-do{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.ban-do div{background:#fff;border:1px solid var(--vien);border-radius:10px;padding:4px;text-align:center;font-size:.68rem;color:var(--nhat)}
.ban-do svg{width:100%;height:auto;display:block}

/* ── gói ── */
.goi{display:grid;grid-template-columns:.85fr 1.15fr;gap:18px;align-items:stretch}
@media(max-width:860px){.goi{grid-template-columns:1fr}}
.goi-o{background:#fff;border:1.5px solid var(--vien);border-radius:20px;padding:22px;display:flex;flex-direction:column}
.goi-o.dinh{background:radial-gradient(ellipse at 20% 0%,#7E1410 0%,var(--tham) 55%,#2E0603 100%);color:var(--kem);border-color:#C79B26}
.goi-o.dinh h3{color:#FFD76A}
.goi-o h3{margin:0 0 4px;font-size:1.35rem}
.goi-o .nhan{align-self:flex-start}
.goi-o .gia{font-family:"Noto Serif",serif;font-size:2.1rem;font-weight:700;color:var(--tham);margin:10px 0 0}
.goi-o.dinh .gia{color:#FFD76A}
.goi-o .gia small{font-size:.9rem;font-weight:400;opacity:.8;display:block;margin-top:-4px}
.goi-o ul{padding-left:0;list-style:none;margin:12px 0 16px;display:grid;gap:7px}
.goi-o li{display:flex;gap:9px;font-size:.93rem}
.goi-o li .uk-ico{color:var(--son);margin-top:.28em}
.goi-o.dinh li .uk-ico{color:#FFD76A}
.goi-o .nut-o{margin-top:auto;display:flex;gap:10px;flex-wrap:wrap}
.quyen{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin:12px 0 4px}
@media(max-width:560px){.quyen{grid-template-columns:repeat(3,1fr)}}
.quyen > span{background:rgba(255,255,255,.08);border:1px solid rgba(212,175,55,.4);border-radius:10px;padding:8px 6px;text-align:center;font-size:.76rem;line-height:1.3}
.quyen > span > b{display:block;color:#FFD76A;font-family:"Noto Serif",serif;font-size:.95rem}
.dinh .st-note{color:#E8D49A}

/* ── FAQ ── */
.faq details{background:#fff;border:1px solid var(--vien);border-radius:12px;padding:12px 16px;margin-bottom:10px}
.faq summary{cursor:pointer;font-weight:700;color:var(--tham)}
.faq p{margin:.6em 0 .2em}

/* ── chân ── */
.st-nhandien{text-align:center;font-size:.84rem;color:var(--nhat);padding:18px;border-top:1px solid var(--vien);background:var(--kem2)}
.gui-tien{display:none}
.gui-tien.on{display:block}
.thanh-dang{height:10px;background:#F1E6CC;border-radius:999px;overflow:hidden;margin:10px 0}
.thanh-dang i{display:block;height:100%;width:0;background:var(--son);transition:width .2s}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
@media print{.st-top,.app,.st-cta{display:none}}

.hai-nhom{display:grid;grid-template-columns:1fr 1fr;gap:0 22px}
@media(max-width:760px){.hai-nhom{grid-template-columns:1fr}}
.hai-nhom .st-luoi{grid-template-columns:1fr 1fr}
.sd-hinh svg.nho{max-width:340px;margin:0 auto}
.nang-cap{background:rgba(255,215,106,.1);border:1px dashed rgba(255,215,106,.6);border-radius:12px;padding:10px 12px;margin:0 0 14px;font-size:.9rem;color:#F4E3B8}
.nang-cap b{display:block;color:#FFD76A;margin-bottom:2px}
/* 29/09/2026: ký hiệu quẻ thay chữ Hán trong danh sách cửu cung */
.sd-ds .so.que{font-family:"DejaVu Sans","Segoe UI Symbol","Apple Symbols",sans-serif;font-size:1.05rem;font-weight:400}
/* 29/09/2026: sơ đồ mặt có hai mặt nam và nữ */
.mat-cap{display:flex;justify-content:space-around;font-weight:700;font-size:.82rem;color:var(--tham);letter-spacing:.06em;text-transform:uppercase;margin-top:2px}
#matSvg .mat-nam,#matSvg .mat-nu{transition:opacity .25s}
#matSvg.ln-nu .mat-nam,#matSvg.ln-nam .mat-nu{opacity:.42}
/* 29/09/2026: bàn tay dấu mực, viền giấy quanh nét đỏ dày theo khi chọn */
.duong path.vien{transition:stroke-width .15s}
.duong.on path.vien{stroke-width:11!important}

/* 29/09/2026: dòng dẫn sang bài viết chuyên sâu */
.st-doc-sau{text-align:center;margin:-14px auto 26px;max-width:800px}
.st-doc-sau a{display:inline-flex;align-items:center;gap:8px;background:#fff;border:1.5px solid var(--dong);border-radius:18px;padding:8px 16px;color:var(--tham);font-weight:700;text-decoration:none;font-size:.92rem;line-height:1.4}
.st-doc-sau a:hover{border-color:var(--son);color:var(--son)}