/* ─────────────────────────────────────────────────────────────────────────────────────────────────────────────
   kt.css — giao diện chung mục "Kiến thức" và các trang tra cứu (vibecheckplus.com/kien-thuc, /hop-tuoi, /ngay-tot,
   /gio-hoang-dao, /lich-am). Chép từ bản thiết kế design/web/kien-thuc/kt.css (sếp duyệt 03/10/2026), đường dẫn tính từ
   gốc trang. Trang tĩnh sinh bằng tools/kien_thuc/ (flutter test tools/kien_thuc/build_test.dart); trang bài viết do hàm
   kienThuc vẽ — cả hai dùng file này. Token, phông, khối cắt góc theo landing/index.html (giao diện V3 đêm tím).
   ───────────────────────────────────────────────────────────────────────────────────────────────────────────── */
@font-face{font-family:'Nunito';font-style:normal;font-weight:400 900;font-display:swap;src:url(/fonts/nunito-var.woff2) format('woff2')}
@font-face{font-family:'Baloo 2';font-style:normal;font-weight:400 800;font-display:swap;src:url(/fonts/baloo2-var.woff2) format('woff2')}
:root{
  --bg:#1B1036;--s1:#2C1C5A;--s2:#3A2870;--bd:#46358A;--bd2:#5A48A6;--edge:#130A2B;
  --t1:#fff;--t2:#D8CEF7;--t3:#B9ACE4;
  --lime:#C7F36B;--lime-sh:#86B32E;--gold:#FFD23F;--gold-sh:#C99700;--pink:#FF7EB6;--sky:#5CC8FF;--lav:#B9A6FF;--orange:#FF9F43;
  --good:#5EDB95;--good-bg:#173A2B;--warn:#FFC24D;--warn-bg:#3F3015;--bad:#FF8AA6;--bad-bg:#421A2C;--lav-bg:#342A6B;--ink:#1B1036;
  --font:'Nunito',system-ui,-apple-system,'Segoe UI',sans-serif;
  --disp:'Baloo 2','Nunito',system-ui,sans-serif;
  --cut:14px;
  color-scheme:dark;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}
body{margin:0;color:var(--t1);font-family:var(--font);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden;
  background:radial-gradient(1200px 700px at 75% -10%,#4A34A0 0,transparent 60%),radial-gradient(900px 600px at -10% 40%,#2C1C5A 0,transparent 60%),var(--bg)}
body::before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.5;z-index:-1;
  background-image:radial-gradient(1.4px 1.4px at 12% 18%,#fff 50%,transparent 51%),radial-gradient(1px 1px at 32% 8%,#fff 50%,transparent 51%),radial-gradient(1.2px 1.2px at 58% 22%,#fff 50%,transparent 51%),radial-gradient(1px 1px at 81% 12%,#fff 50%,transparent 51%),radial-gradient(1.6px 1.6px at 90% 36%,#fff 50%,transparent 51%),radial-gradient(1px 1px at 6% 62%,#fff 50%,transparent 51%),radial-gradient(1.3px 1.3px at 44% 70%,#fff 50%,transparent 51%),radial-gradient(1px 1px at 70% 84%,#fff 50%,transparent 51%),radial-gradient(1.2px 1.2px at 24% 92%,#fff 50%,transparent 51%)}
a{color:var(--lime);text-underline-offset:3px}
img{max-width:100%;height:auto;display:block}
:focus-visible{outline:3px solid var(--lime);outline-offset:3px}
.wrap{max-width:1140px;margin:0 auto;padding-inline:16px}
h1,h2,h3,h4{margin:0;font-family:var(--disp);font-weight:800;line-height:1.12;text-wrap:balance}
p{margin:0}
.eyebrow{display:inline-block;font-family:var(--disp);font-size:14px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--lime)}
.muted{color:var(--t2)}
.fine{font-size:13px;color:var(--t3);line-height:1.5}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:absolute;left:12px;top:-60px;z-index:50;background:var(--lime);color:var(--ink);padding:12px 16px;font-weight:800;text-decoration:none}
.skip:focus{top:12px}

/* Khối cắt góc kiểu game (VcBlock) */
.cut{clip-path:polygon(var(--cut) 0,calc(100% - var(--cut)) 0,100% var(--cut),100% calc(100% - var(--cut)),calc(100% - var(--cut)) 100%,var(--cut) 100%,0 calc(100% - var(--cut)),0 var(--cut))}
.card{position:relative;background:var(--s1);padding:22px;--cut:18px;box-shadow:inset 0 0 0 2px var(--bd)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:0 24px;font:800 17px/1 var(--disp);text-decoration:none;border:0;cursor:pointer;color:var(--ink);
  background:linear-gradient(180deg,#DDFB95,var(--lime));box-shadow:0 5px 0 var(--lime-sh);transition:transform .15s;--cut:12px;text-align:center}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(3px);box-shadow:0 2px 0 var(--lime-sh)}
.btn.ghost{background:var(--s2);color:var(--t1);box-shadow:inset 0 0 0 2px var(--bd2)}
.btn.gold{background:linear-gradient(180deg,#FFE27A,var(--gold));box-shadow:0 5px 0 var(--gold-sh)}
.chip{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;background:var(--s2);color:var(--t2);font-size:13px;font-weight:800;white-space:nowrap;--cut:7px;text-decoration:none;line-height:1.35}
.chip.good{background:var(--good-bg);color:var(--good)}.chip.warn{background:var(--warn-bg);color:var(--warn)}.chip.bad{background:var(--bad-bg);color:var(--bad)}.chip.lav{background:var(--lav-bg);color:var(--lav)}.chip.gold{background:var(--gold);color:var(--ink)}
/* Chip bấm được (lọc, chuyển trang) — vùng bấm ≥ 44px */
a.chip,button.chip{min-height:44px;padding:0 16px;font-size:14px;border:0;cursor:pointer;font-family:var(--font)}
a.chip:hover,button.chip:hover{color:var(--t1);background:var(--bd)}
a.chip[aria-current],button.chip[aria-pressed="true"]{background:var(--lime);color:var(--ink)}

/* ── Đầu trang ── */
.nav{position:sticky;top:0;z-index:20;background:rgba(27,16,54,.9);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:2px solid var(--bd)}
.nav .bar{display:flex;align-items:center;gap:16px;min-height:64px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--t1);font:800 22px/1 var(--disp);min-height:44px}
.logo img{width:36px;height:36px;border-radius:10px}
.logo small{font:800 13px/1 var(--font);color:var(--ink);background:var(--lime);padding:4px 8px;--cut:5px;letter-spacing:.02em}
.nav .links{display:flex;gap:4px;list-style:none;margin:0 0 0 auto;padding:0}
.nav .links a{display:flex;align-items:center;min-height:44px;color:var(--t2);text-decoration:none;font-size:15px;font-weight:800;padding:0 8px;white-space:nowrap}
.nav .links a:hover,.nav .links a[aria-current]{color:var(--t1)}
.nav .links a[aria-current]{box-shadow:inset 0 -3px 0 var(--lime)}
.nav .btn{min-height:44px;padding:0 18px;font-size:15px;box-shadow:0 4px 0 var(--lime-sh)}
.subnav{display:none}
@media (max-width:1180px){
  .nav .links{display:none}.nav .btn{margin-left:auto}
  .subnav{display:block;border-top:1px solid var(--bd)}
  .subnav ul{display:flex;gap:6px;list-style:none;margin:0;padding:8px 16px;overflow-x:auto;scrollbar-width:none}
  .subnav ul::-webkit-scrollbar{display:none}
  .subnav a{min-height:44px;font-size:13px}
}

/* ── Vụn bánh mì ── */
.crumb{font-size:14px;color:var(--t3);margin:22px 0 14px}
.crumb ol{display:flex;flex-wrap:wrap;gap:2px 0;list-style:none;margin:0;padding:0}
.crumb li{display:flex;align-items:center}
.crumb li+li::before{content:"›";margin:0 8px;color:var(--bd2)}
.crumb a{color:var(--t2);text-decoration:none;display:inline-flex;align-items:center;min-height:44px}
.crumb a:hover{color:var(--t1);text-decoration:underline}

/* ── Khối chung ── */
section{padding-block:44px}
.head{display:flex;flex-direction:column;gap:8px;max-width:46em;margin-bottom:24px}
.head h2{font-size:clamp(28px,3.6vw,40px)}
.head p{color:var(--t2);font-size:17px}
.row-head{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:10px 20px;margin-bottom:20px}
.row-head h2{font-size:clamp(26px,3.2vw,36px)}
.more{font-weight:800;text-decoration:none;display:inline-flex;align-items:center;min-height:44px}
.more:hover{text-decoration:underline}
.grid{display:grid;gap:16px}
.g2{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
.g3{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
.g4{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}

/* ── Hero trang chủ Kiến thức ── */
.hero{padding-block:40px 24px}
.hero .wrap{display:grid;grid-template-columns:1.2fr .8fr;gap:24px;align-items:center}
.hero h1{font-size:clamp(40px,6vw,72px);margin-top:8px}
.hero h1 em{font-style:normal;color:var(--lime)}
.lead{font-size:clamp(17px,1.6vw,19px);color:var(--t2);max-width:34em;margin-top:14px}
.hero-art{position:relative;min-height:300px;display:flex;align-items:flex-end;justify-content:center}
.hero-art .ring{position:absolute;left:50%;top:50%;width:min(300px,80%);aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;border:8px solid var(--lime);box-shadow:0 0 34px rgba(199,243,107,.4),inset 0 0 24px rgba(199,243,107,.2)}
.hero-art img{position:relative;height:300px;width:auto;filter:drop-shadow(0 14px 14px rgba(8,4,20,.6));animation:bob 3.4s ease-in-out infinite}
.hero-art .bubble{position:absolute;right:0;top:6%;max-width:220px;background:#fff;color:var(--ink);padding:12px 14px;font-weight:800;font-size:14px;line-height:1.35;z-index:3;--cut:10px}
@keyframes bob{50%{transform:translateY(-8px)}}
@media (max-width:860px){.hero .wrap{grid-template-columns:minmax(0,1fr)}.hero-art{display:none}}

/* Ô tìm kiếm */
.search{position:relative;margin-top:22px;max-width:620px}
.search form{display:flex;gap:0}
.search input{flex:1;min-width:0;min-height:56px;padding:0 16px;background:var(--bg);border:2px solid var(--bd2);border-right:0;color:var(--t1);font:700 17px var(--font);border-radius:0}
.search input::placeholder{color:var(--t3)}
.search input:focus{outline:none;border-color:var(--lime)}
.search button{min-height:56px;min-width:56px;padding:0 20px;border:0;background:var(--lime);color:var(--ink);font:800 16px var(--disp);cursor:pointer;display:flex;align-items:center;gap:8px}
.search .sug{position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:15;background:var(--s1);box-shadow:inset 0 0 0 2px var(--bd2),0 18px 40px rgba(8,4,20,.6);padding:6px;list-style:none;margin:0}
.search .sug a{display:flex;justify-content:space-between;gap:12px;align-items:center;min-height:44px;padding:8px 12px;color:var(--t1);text-decoration:none;font-weight:700}
.search .sug a:hover,.search .sug a:focus{background:var(--s2)}
.search .sug small{color:var(--t3);font-weight:700;font-size:12px;white-space:nowrap}
.popular{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;align-items:center}
.popular span{font-size:14px;color:var(--t3);font-weight:800;margin-right:4px}

/* Thẻ danh mục */
.cats{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.cat{display:grid;grid-template-columns:56px 1fr;gap:4px 14px;align-items:center;padding:16px 18px;text-decoration:none;color:var(--t1);background:var(--s1);box-shadow:inset 0 0 0 2px var(--bd);--cut:14px;transition:transform .15s,background .15s;min-height:88px}
.cat:hover{transform:translateY(-2px);background:var(--s2)}
.cat .ic{grid-row:span 2;width:56px;height:56px;display:grid;place-items:center;font:800 24px var(--disp);color:var(--ink);clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%)}
.cat b{font:800 19px/1.15 var(--disp)}
.cat span{font-size:13px;color:var(--t3);font-weight:700}

/* Công cụ tra nhanh */
.tools{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
@media (max-width:1040px){.tools{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.tools{grid-template-columns:minmax(0,1fr)}}
.tool{display:flex;flex-direction:column;gap:12px;padding:18px}
.tool h3{font-size:21px;display:flex;align-items:center;gap:10px}
.tool h3 i{font-style:normal;display:grid;place-items:center;width:34px;height:34px;background:var(--lav-bg);color:var(--lav);font-size:17px;--cut:7px;flex:none}
.tool .big{font:800 30px/1.05 var(--disp)}
.tool .big small{display:block;font:700 13px var(--font);color:var(--t3);margin-top:4px}
.tool .btn{min-height:46px;font-size:15px;margin-top:auto}
.tool label{font-size:13px;font-weight:800;color:var(--t2)}
.tool select{appearance:none;min-height:46px;padding:0 12px;background:var(--bg);border:2px solid var(--bd2);color:var(--t1);font:700 15px var(--font);width:100%;border-radius:0}
.tool .pair{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.mini-hours{display:grid;grid-template-columns:repeat(6,1fr);gap:4px}
.mini-hours span{padding:5px 0;text-align:center;font:800 12px var(--disp);background:var(--bg);color:var(--t3);--cut:5px}
.mini-hours span.on{background:var(--good-bg);color:var(--good)}
.mini-days{display:flex;flex-direction:column;gap:6px}
.mini-days a{display:flex;justify-content:space-between;align-items:center;gap:8px;min-height:44px;padding:6px 12px;background:var(--bg);color:var(--t1);text-decoration:none;font-weight:800;--cut:8px}
.mini-days a span{font-size:12px;color:var(--t3);font-weight:700;white-space:nowrap}
.mini-days a:hover{background:var(--s2)}

/* Thẻ bài viết */
.post{display:flex;flex-direction:column;background:var(--s1);box-shadow:inset 0 0 0 2px var(--bd);--cut:16px;text-decoration:none;color:var(--t1);overflow:hidden;transition:transform .15s}
.post:hover{transform:translateY(-3px)}
.post:hover h3{text-decoration:underline;text-decoration-color:var(--lime);text-underline-offset:4px}
.post .thumb{position:relative;aspect-ratio:16/9;display:flex;align-items:flex-end;justify-content:center;overflow:hidden}
.post .thumb img{height:92%;width:auto;filter:drop-shadow(0 10px 10px rgba(8,4,20,.55))}
.post .thumb .num{position:absolute;left:16px;top:10px;font:800 72px/1 var(--disp);color:rgba(255,255,255,.92);text-shadow:0 6px 0 rgba(8,4,20,.35)}
.post .body{display:flex;flex-direction:column;gap:8px;padding:16px 18px 18px}
.post h3{font-size:20px;line-height:1.2}
.post p{font-size:15px;color:var(--t2)}
.post .meta{display:flex;flex-wrap:wrap;gap:6px 12px;font-size:13px;color:var(--t3);font-weight:700;margin-top:auto;padding-top:4px}
.post.feature{display:grid;grid-template-columns:1.1fr 1fr}
.post.feature .thumb{aspect-ratio:auto;min-height:280px}
.post.feature h3{font-size:clamp(24px,2.6vw,32px)}
@media (max-width:760px){.post.feature{grid-template-columns:minmax(0,1fr)}.post.feature .thumb{min-height:0;aspect-ratio:16/9}}
/* Nền thumbnail theo danh mục */
.bg-tuvi{background:radial-gradient(circle at 70% 30%,#7A4BD1,#2C1C5A 70%)}
.bg-sao{background:radial-gradient(circle at 30% 20%,#3E6BD6,#2C1C5A 70%)}
.bg-so{background:radial-gradient(circle at 70% 20%,#C2477E,#2C1C5A 72%)}
.bg-ngay{background:radial-gradient(circle at 30% 30%,#B27A12,#2C1C5A 72%)}
.bg-hop{background:radial-gradient(circle at 60% 30%,#2E8A62,#2C1C5A 72%)}
.bg-le{background:radial-gradient(circle at 40% 25%,#B5452F,#2C1C5A 72%)}

/* Dải kêu gọi mở app */
.band{display:grid;grid-template-columns:auto 1fr auto;gap:24px;align-items:center;padding:26px 28px;background:linear-gradient(135deg,#4A34A0,#2C1C5A);box-shadow:inset 0 0 0 3px var(--lime);--cut:22px}
.band img{height:170px;width:auto}
.band h2{font-size:clamp(26px,3.4vw,40px)}
.band p{color:var(--t2);margin-top:8px;font-size:17px;max-width:36em}
.band ul{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.band .act{display:flex;flex-direction:column;gap:8px;align-items:stretch}
.band .act .fine{text-align:center}
@media (max-width:860px){.band{grid-template-columns:1fr;text-align:center}.band img{margin:0 auto;height:140px}.band ul{justify-content:center}.band p{margin-inline:auto}}

/* ── Trang danh mục ── */
.cat-hero{display:grid;grid-template-columns:1fr auto;gap:20px;align-items:end;padding-bottom:8px}
.cat-hero h1{font-size:clamp(36px,5vw,60px)}
.cat-hero img{height:190px;width:auto;filter:drop-shadow(0 12px 12px rgba(8,4,20,.55))}
@media (max-width:700px){.cat-hero{grid-template-columns:1fr}.cat-hero img{display:none}}
.facts{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:28px;align-items:start}
@media (max-width:980px){.layout{grid-template-columns:minmax(0,1fr)}}
.side{display:flex;flex-direction:column;gap:16px}
@media (min-width:981px){.side.sticky{position:sticky;top:84px}}
.side h2{font-size:21px;margin-bottom:10px}
.list-row{display:grid;grid-template-columns:132px 1fr;gap:16px;padding:14px;background:var(--s1);box-shadow:inset 0 0 0 2px var(--bd);--cut:14px;text-decoration:none;color:var(--t1);align-items:center}
.list-row:hover{background:var(--s2)}
.list-row:hover h3{text-decoration:underline;text-decoration-color:var(--lime)}
.list-row .thumb{aspect-ratio:1;display:flex;align-items:flex-end;justify-content:center;overflow:hidden;--cut:10px;position:relative}
.list-row .thumb img{height:92%;width:auto}
.list-row .thumb .num{position:absolute;left:10px;top:4px;font:800 40px/1 var(--disp);color:#fff}
.list-row h3{font-size:19px;line-height:1.2}
.list-row p{font-size:14px;color:var(--t2);margin-top:6px}
.list-row .meta{font-size:12px;color:var(--t3);font-weight:700;margin-top:8px;display:flex;flex-wrap:wrap;gap:4px 12px}
@media (max-width:520px){.list-row{grid-template-columns:84px 1fr;gap:12px;padding:12px}.list-row .thumb .num{font-size:28px}.list-row h3{font-size:17px}.list-row p{display:none}}
.pager{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:center;margin-top:24px}
.pager a,.pager span{display:grid;place-items:center;min-width:46px;min-height:46px;padding:0 12px;background:var(--s1);color:var(--t1);text-decoration:none;font:800 16px var(--disp);box-shadow:inset 0 0 0 2px var(--bd);--cut:8px}
.pager a:hover{background:var(--s2)}
.pager [aria-current]{background:var(--lime);color:var(--ink);box-shadow:none}
.pager .gap{background:none;box-shadow:none;color:var(--t3);min-width:20px}
.numgrid{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}
.numgrid a{display:grid;place-items:center;min-height:52px;background:var(--bg);color:var(--t1);text-decoration:none;font:800 22px var(--disp);--cut:9px;box-shadow:inset 0 0 0 2px var(--bd)}
.numgrid a:hover{background:var(--s2)}
.numgrid a.master{color:var(--gold)}
.numgrid a[aria-current]{background:var(--lime);color:var(--ink);box-shadow:none}

/* ── Trang bài viết ── */
.article-head h1{font-size:clamp(32px,4.6vw,54px);margin-top:4px}
.article-head .dek{font-size:clamp(17px,1.7vw,20px);color:var(--t2);margin-top:14px;max-width:40em}
.byline{display:flex;flex-wrap:wrap;gap:12px 22px;align-items:center;margin-top:18px;padding:14px 16px;background:rgba(44,28,90,.6);box-shadow:inset 0 0 0 2px var(--bd);--cut:12px;font-size:14px;color:var(--t2)}
.byline .who{display:flex;align-items:center;gap:10px}
.byline .av{width:40px;height:40px;border-radius:50%;background:var(--s2);display:grid;place-items:center;font:800 16px var(--disp);color:var(--lime);flex:none;overflow:hidden}
.byline .av img{height:56px;width:auto;margin-top:14px}
.byline b{color:var(--t1)}
.byline a{color:var(--t1);font-weight:800}
.byline .sep{width:1px;align-self:stretch;background:var(--bd)}
@media (max-width:640px){.byline .sep{display:none}}
.answer{margin-top:20px;padding:18px 20px;background:var(--lav-bg);box-shadow:inset 4px 0 0 var(--lime);font-size:17px;color:var(--t1)}
.answer b{color:var(--lime)}
.toc{padding:18px 18px 12px}
.toc h2{font-size:18px;margin-bottom:6px}
.toc ol{margin:0;padding:0;list-style:none;counter-reset:t}
.toc li{counter-increment:t}
.toc a{display:flex;gap:10px;min-height:44px;align-items:center;color:var(--t2);text-decoration:none;font-weight:700;font-size:15px;line-height:1.3;padding:4px 0}
.toc a::before{content:counter(t);font:800 13px var(--disp);color:var(--ink);background:var(--lime);min-width:22px;height:22px;display:grid;place-items:center;--cut:4px;clip-path:polygon(4px 0,calc(100% - 4px) 0,100% 4px,100% calc(100% - 4px),calc(100% - 4px) 100%,4px 100%,0 calc(100% - 4px),0 4px)}
.toc a:hover{color:var(--t1)}
details.toc-m{display:none}
@media (max-width:980px){.side .toc{display:none}details.toc-m{display:block;margin-top:18px}details.toc-m summary{cursor:pointer;list-style:none;min-height:48px;display:flex;align-items:center;justify-content:space-between;font:800 17px var(--disp)}details.toc-m summary::-webkit-details-marker{display:none}details.toc-m summary::after{content:"+";color:var(--lime);font-size:24px}details.toc-m[open] summary::after{content:"–"}}
.prose{font-size:18px;line-height:1.75;color:var(--t2);max-width:44em}
.prose>*+*{margin-top:18px}
.prose h2{font-size:clamp(26px,3vw,34px);color:var(--t1);margin-top:44px;scroll-margin-top:90px}
.prose h3{font-size:22px;color:var(--t1);margin-top:28px;scroll-margin-top:90px}
.prose strong{color:var(--t1)}
.prose ul,.prose ol{padding-left:0;list-style:none}
.prose ul li,.prose ol li{position:relative;padding-left:28px}
.prose ul li+li,.prose ol li+li{margin-top:8px}
.prose ul li::before{content:"";position:absolute;left:4px;top:.62em;width:10px;height:10px;background:var(--lime);transform:rotate(45deg)}
.prose ol{counter-reset:o}
.prose ol li{counter-increment:o}
.prose ol li::before{content:counter(o);position:absolute;left:0;top:.2em;font:800 14px/22px var(--disp);width:22px;height:22px;text-align:center;background:var(--gold);color:var(--ink)}
.prose blockquote{margin:24px 0;padding:18px 22px;background:var(--s1);box-shadow:inset 4px 0 0 var(--gold);color:var(--t1);font:700 20px/1.5 var(--font)}
.prose blockquote footer{font-size:14px;color:var(--t3);margin-top:8px;font-weight:700}
.prose a{font-weight:800}
.table-wrap{overflow-x:auto;margin:22px 0;box-shadow:inset 0 0 0 2px var(--bd);--cut:12px;background:var(--s1)}
table{border-collapse:collapse;width:100%;font-size:15px;line-height:1.45}
caption{text-align:left;padding:14px 16px 4px;font:800 16px var(--disp);color:var(--t1)}
th,td{padding:11px 14px;text-align:left;vertical-align:top;border-bottom:1px solid var(--bd)}
thead th{font:800 13px var(--font);letter-spacing:.04em;text-transform:uppercase;color:var(--t3);background:rgba(19,10,43,.5)}
tbody th{color:var(--t1);font-weight:800}
tbody tr:last-child>*{border-bottom:0}
td{color:var(--t2)}
.tip{display:grid;grid-template-columns:96px 1fr;gap:16px;align-items:end;padding:18px 20px 0;background:linear-gradient(180deg,var(--s2),var(--s1));box-shadow:inset 0 0 0 2px var(--bd2);--cut:16px;margin:26px 0;overflow:hidden}
.tip img{height:130px;width:auto;align-self:end}
.tip div{padding-bottom:18px}
.tip b{display:block;font:800 17px var(--disp);color:var(--lime);margin-bottom:4px}
.tip p{font-size:16px;color:var(--t1);line-height:1.55}
@media (max-width:480px){.tip{grid-template-columns:72px 1fr}.tip img{height:100px}}
.apply{margin:30px 0;padding:22px;background:linear-gradient(135deg,#3B2A86,#2C1C5A);box-shadow:inset 0 0 0 3px var(--lime);--cut:18px;display:grid;grid-template-columns:1fr auto;gap:18px;align-items:center}
.apply h2,.apply h3{font-size:24px;color:var(--t1);margin:0}
.apply p{font-size:16px;color:var(--t2);margin-top:6px}
.apply ul{margin-top:10px!important}
.apply li{font-size:15px}
.apply .btn{white-space:nowrap}
@media (max-width:640px){.apply{grid-template-columns:1fr}.apply .btn{width:100%}}
.sources{font-size:15px;color:var(--t2)}
.sources li{padding-left:22px!important}
.faq{display:flex;flex-direction:column;gap:10px}
.faq details{background:var(--s1);padding:0 18px;box-shadow:inset 0 0 0 2px var(--bd);--cut:12px}
.faq summary{cursor:pointer;list-style:none;min-height:56px;padding:14px 0;font:800 18px/1.3 var(--disp);display:flex;justify-content:space-between;align-items:center;gap:16px;color:var(--t1)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--lime);font-size:26px;line-height:1;flex:none}
.faq details[open] summary::after{content:"–"}
.faq details p{padding-bottom:16px;color:var(--t2);font-size:16px}
.note{padding:14px 16px;background:var(--warn-bg);color:var(--t1);font-size:15px;--cut:10px;line-height:1.55}
.note b{color:var(--warn)}
.review{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:start;padding:18px}
.review .av{width:52px;height:52px;border-radius:50%;background:var(--lav-bg);display:grid;place-items:center;font:800 20px var(--disp);color:var(--lav)}
.review h2{font-size:18px}
.review p{font-size:14px;color:var(--t2);margin-top:4px}
.share{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.share span{font-size:14px;color:var(--t3);font-weight:800;margin-right:4px}

/* ── Hợp tuổi ── */
.vs-hero{display:grid;grid-template-columns:1fr auto 1fr;align-items:end;gap:8px;padding:22px 18px 18px;background:linear-gradient(180deg,var(--s2),var(--s1));box-shadow:inset 0 0 0 2px var(--bd2);--cut:20px}
.vs-hero figure{margin:0;display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center}
.vs-hero img{height:210px;width:auto;filter:drop-shadow(0 10px 10px rgba(8,4,20,.5))}
.vs-hero .flip{transform:scaleX(-1)}
.vs-hero figcaption{font:800 18px/1.2 var(--disp)}
.vs-hero figcaption span{display:block;font:700 13px var(--font);color:var(--t3)}
.ring-score{align-self:center;display:grid;place-items:center;width:118px;height:118px;border-radius:50%;background:var(--bg);box-shadow:inset 0 0 0 9px var(--warn);text-align:center}
.ring-score b{font:800 40px/1 var(--disp);color:var(--warn)}
.ring-score span{display:block;font-size:12px;color:var(--t3);font-weight:800}
@media (max-width:520px){.vs-hero img{height:130px}.ring-score{width:86px;height:86px;box-shadow:inset 0 0 0 7px var(--warn)}.ring-score b{font-size:28px}.vs-hero figcaption{font-size:15px}}
.verdict-line{font:800 clamp(22px,2.6vw,28px) var(--disp);color:var(--warn);margin-top:16px;text-align:center}
.kv{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px}
.kv.k3{grid-template-columns:repeat(auto-fill,minmax(210px,1fr))}
.kv div{padding:14px 16px;background:var(--s1);box-shadow:inset 0 0 0 2px var(--bd);--cut:10px}
.kv dt{font-size:12px;font-weight:900;letter-spacing:.06em;text-transform:uppercase;color:var(--t3)}
.kv dd{margin:4px 0 0;font:800 19px/1.25 var(--disp);color:var(--t1)}
.kv dd small{display:block;font:700 13px var(--font);color:var(--t2);margin-top:2px}
.score-pill{display:inline-grid;place-items:center;min-width:46px;padding:3px 8px;font:800 15px var(--disp);--cut:6px}
.s-good{background:var(--good-bg);color:var(--good)}.s-mid{background:var(--s2);color:var(--t1)}.s-warn{background:var(--warn-bg);color:var(--warn)}.s-bad{background:var(--bad-bg);color:var(--bad)}
.zgrid{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}
@media (max-width:760px){.zgrid{grid-template-columns:repeat(3,1fr)}}
.zgrid a{display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 6px 10px;background:var(--s1);box-shadow:inset 0 0 0 2px var(--bd);--cut:12px;text-decoration:none;color:var(--t1);text-align:center;min-height:44px}
.zgrid a:hover{background:var(--s2)}
.zgrid a[aria-current]{box-shadow:inset 0 0 0 3px var(--lime)}
.zgrid img{height:78px;width:auto}
.zgrid b{font:800 16px/1.1 var(--disp)}
.zgrid .chip{padding:2px 8px;font-size:11px;min-height:0}

/* ── Ngày tốt ── */
.filters{display:flex;flex-direction:column;gap:10px;margin-top:18px}
.filters .row{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;scrollbar-width:thin}
.filters .lbl{font-size:13px;font-weight:900;letter-spacing:.06em;text-transform:uppercase;color:var(--t3)}
.month{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px}
.month .dow{font-size:12px;font-weight:900;color:var(--t3);text-align:center;padding:4px 0}
.month .d{position:relative;min-height:74px;padding:6px 6px 6px;background:var(--s1);color:var(--t2);--cut:8px;display:flex;flex-direction:column;gap:2px;text-decoration:none;box-shadow:inset 0 0 0 1px var(--bd)}
.month .d b{font:800 20px/1 var(--disp);color:var(--t1)}
.month .d small{font-size:11px;font-weight:800;color:var(--t3)}
.month .d em{font-style:normal;font-size:11px;font-weight:800;margin-top:auto;line-height:1.2}
.month .d.top{background:linear-gradient(180deg,#FFE27A,var(--gold));box-shadow:none}
.month .d.top b,.month .d.top small,.month .d.top em{color:var(--ink)}
.month .d.ok{background:var(--good-bg);box-shadow:inset 0 0 0 2px #2E6B4E}
.month .d.ok em{color:var(--good)}
.month .d.retro{background:repeating-linear-gradient(135deg,var(--s1) 0 8px,#33215F 8px 16px)}
.month .d.retro em{color:var(--warn)}
.month .d.no em{color:var(--bad)}
.month .d.empty{background:none;box-shadow:none}
@media (max-width:520px){.month{gap:4px}.month .d{min-height:58px;padding:4px}.month .d b{font-size:16px}.month .d em{display:none}.month .d small{font-size:10px}}
.day-card{display:grid;grid-template-columns:96px 1fr auto;gap:16px;align-items:center;padding:16px 18px}
.day-card .date{text-align:center;padding:10px 0;background:linear-gradient(180deg,#FFE27A,var(--gold));color:var(--ink);--cut:10px}
.day-card .date b{display:block;font:800 34px/1 var(--disp)}
.day-card .date span{font-size:12px;font-weight:900}
.day-card h3{font-size:21px}
.day-card .tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.day-card p{font-size:15px;color:var(--t2);margin-top:8px}
.day-card .sc{text-align:center}
.day-card .sc b{display:block;font:800 30px/1 var(--disp);color:var(--good)}
.day-card .sc span{font-size:11px;color:var(--t3);font-weight:800}
.day-card.ok .date{background:var(--good-bg);color:var(--good);box-shadow:inset 0 0 0 2px #2E6B4E}
@media (max-width:600px){.day-card{grid-template-columns:72px 1fr}.day-card .sc{display:none}.day-card .date b{font-size:26px}}
.legend{display:flex;flex-wrap:wrap;gap:8px 16px;margin-top:12px;font-size:13px;color:var(--t2);font-weight:700}
.legend i{display:inline-block;width:12px;height:12px;margin-right:6px;vertical-align:-1px;transform:rotate(45deg)}

/* ── Giờ hoàng đạo ── */
.day-hero{display:grid;grid-template-columns:auto 1fr;gap:22px;align-items:center;padding:22px}
.calpage{width:150px;text-align:center;background:linear-gradient(180deg,#fff,#E6E0FA);color:var(--ink);--cut:14px;box-shadow:0 6px 0 #B8B0D6;overflow:hidden}
.calpage .m{background:var(--bad);color:#fff;font:800 14px/1 var(--disp);padding:8px 0;letter-spacing:.06em}
.calpage .d{font:800 72px/1 var(--disp);padding-top:8px}
.calpage .w{font-weight:900;font-size:14px}
.calpage .l{font-weight:800;font-size:13px;padding:8px 0 10px;border-top:1px dashed #B8B0D6;margin-top:6px;color:#4A3A7A}
.day-hero h2{font-size:clamp(24px,3vw,32px)}
.day-hero .tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
@media (max-width:600px){.day-hero{grid-template-columns:1fr;justify-items:center;text-align:center}.day-hero .tags{justify-content:center}}
.hours{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
@media (max-width:760px){.hours{grid-template-columns:repeat(3,1fr)}}
@media (max-width:400px){.hours{grid-template-columns:repeat(2,1fr)}}
.hour{padding:12px 10px;background:var(--s1);color:var(--t3);box-shadow:inset 0 0 0 2px var(--bd);--cut:10px;display:flex;flex-direction:column;gap:2px;min-height:118px}
.hour b{font:800 22px/1.05 var(--disp);color:var(--t2)}
.hour .t{font:800 14px var(--disp);color:var(--t2)}
.hour .g{font-size:13px;font-weight:800;margin-top:auto}
.hour .n{font-size:12px;font-weight:700;line-height:1.35}
.hour.good{background:var(--good-bg);box-shadow:inset 0 0 0 2px #2E6B4E}
.hour.good b,.hour.good .g{color:var(--good)}
.hour.good .t,.hour.good .n{color:#C9F2DA}
.hour.best{background:linear-gradient(180deg,#FFE27A,var(--gold));box-shadow:none}
.hour.best b,.hour.best .t,.hour.best .g,.hour.best .n{color:var(--ink)}
.hour .badge{align-self:flex-start;font-size:11px;font-weight:900;padding:1px 6px;background:var(--ink);color:var(--gold);margin-bottom:2px;--cut:4px}
.do-dont{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:640px){.do-dont{grid-template-columns:1fr}}
.do-dont h3{font-size:20px;margin-bottom:10px;display:flex;align-items:center;gap:8px}
.do-dont ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.do-dont li{display:flex;gap:10px;color:var(--t1);font-weight:700}
.do-dont .yes li::before{content:"✓";color:var(--good);font-weight:900}
.do-dont .no li::before{content:"✕";color:var(--bad);font-weight:900}
.daynav{display:grid;grid-template-columns:1fr auto 1fr;gap:10px;align-items:stretch}
.daynav a{display:flex;flex-direction:column;justify-content:center;gap:2px;min-height:64px;padding:10px 16px;background:var(--s1);box-shadow:inset 0 0 0 2px var(--bd);--cut:12px;color:var(--t1);text-decoration:none;font:800 16px/1.2 var(--disp)}
.daynav a:hover{background:var(--s2)}
.daynav a span{font:700 13px var(--font);color:var(--t3)}
.daynav a.next{text-align:right}
.daynav a.today{background:var(--lav-bg);text-align:center;justify-content:center}
@media (max-width:560px){.daynav{grid-template-columns:1fr 1fr}.daynav a.today{grid-column:span 2;order:3}}

/* ── Chân trang ── */
footer.site{padding-block:40px 48px;border-top:2px solid var(--bd);margin-top:40px}
footer.site .cols{display:grid;grid-template-columns:1.3fr repeat(3,1fr);gap:24px}
@media (max-width:860px){footer.site .cols{grid-template-columns:1fr 1fr}}
@media (max-width:480px){footer.site .cols{grid-template-columns:1fr}}
footer.site h2{font-size:15px;letter-spacing:.06em;text-transform:uppercase;color:var(--t3);margin-bottom:8px;font-family:var(--font);font-weight:900}
footer.site ul{list-style:none;margin:0;padding:0}
footer.site li a{display:flex;align-items:center;min-height:44px;color:var(--t2);text-decoration:none;font-weight:700;font-size:15px}
footer.site li a:hover{color:var(--t1);text-decoration:underline}
footer.site .about p{color:var(--t2);font-size:14px;margin-top:10px;max-width:24em}
footer.site .legal{margin-top:28px;padding-top:18px;border-top:1px solid var(--bd);font-size:13px;color:var(--t3);display:flex;flex-direction:column;gap:6px}

/* Di động: thẻ bài trong lưới thu gọn thành hàng ngang cho đỡ dài trang. */
@media (max-width:600px){
  .g3 .post{display:grid;grid-template-columns:112px 1fr}
  .g3 .post .thumb{aspect-ratio:auto;min-height:100%}
  .g3 .post .thumb img{height:auto;width:100%;max-height:150px;object-fit:contain;object-position:bottom}
  .g3 .post p{display:none}
  .g3 .post .thumb .num{font-size:40px;left:8px;top:4px}
  .g3 .post .body{padding:12px 14px}
  .g3 .post h3{font-size:17px}
  .g3 .post .chip{display:none}
}
@media (max-width:520px){th,td{padding:9px 10px;font-size:14px}caption{font-size:15px;padding:12px 10px 4px}thead th{font-size:11px}}
.nw{white-space:nowrap}
/* Bảng xếp chồng trên di động: mỗi hàng thành một thẻ, nhãn cột lấy từ data-label. */
@media (max-width:640px){
  table.stack thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
  table.stack tr{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;padding:12px 14px;border-bottom:1px solid var(--bd)}
  table.stack tbody tr:last-child{border-bottom:0}
  table.stack th,table.stack td{display:block;padding:0;border:0}
  table.stack th{grid-column:1 / -1;font-size:15px}
  table.stack td[data-label]::before{content:attr(data-label) ": ";font-weight:900;font-size:12px;color:var(--t3);text-transform:uppercase;letter-spacing:.04em}
  table.stack td[data-label="Điểm"]{grid-row:2;grid-column:2;justify-self:end}
  table.stack td[data-label="Điểm"]::before{content:none}
  table.stack td[data-label="Mệnh"]{grid-row:2;grid-column:1}
  table.stack td[data-label="Lời khuyên"]{grid-column:1 / -1}
}
.month .d.no{box-shadow:inset 0 0 0 1px #7A2F4B}
.month .d.no b{color:var(--t2)}
@media (max-width:520px){.kv{grid-template-columns:1fr 1fr}.kv div{padding:12px}.kv dd{font-size:17px}}
@media (max-width:600px){.day-card .date{align-self:start}}
.popular .chip{white-space:normal}

/* ── Bổ sung khi làm thật (trang tra cứu sinh tự động) ── */
.ring-score.good{box-shadow:inset 0 0 0 9px var(--good)}.ring-score.good b{color:var(--good)}
.ring-score.mid{box-shadow:inset 0 0 0 9px var(--bd2)}.ring-score.mid b{color:var(--t1)}
.verdict-line.good{color:var(--good)}.verdict-line.mid{color:var(--t1)}.verdict-line.bad{color:var(--bad)}
@media (max-width:520px){.ring-score.good{box-shadow:inset 0 0 0 7px var(--good)}.ring-score.mid{box-shadow:inset 0 0 0 7px var(--bd2)}}
.vs-hero.solo{grid-template-columns:auto 1fr;align-items:center;gap:18px}
.vs-hero.solo img{height:170px}
@media (max-width:520px){.vs-hero.solo img{height:120px}}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.past{margin-top:16px;padding:14px 16px;background:var(--lav-bg);color:var(--t1);font-size:15px;--cut:10px}
.past a{font-weight:800}
.month .d.lunar1 small{color:var(--gold)}
.month .d.hd{background:var(--good-bg);box-shadow:inset 0 0 0 2px #2E6B4E}
.month .d.hd em{color:var(--good)}
.month .d.today{box-shadow:inset 0 0 0 3px var(--lime)}
.daynav.two{grid-template-columns:1fr 1fr}
.groups{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
.groups h3{font-size:19px;margin-bottom:10px}
.links-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.months{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px}
.months a{display:flex;flex-direction:column;justify-content:center;min-height:56px;padding:8px 12px;background:var(--s1);box-shadow:inset 0 0 0 2px var(--bd);--cut:10px;color:var(--t1);text-decoration:none;font:800 17px/1.2 var(--disp)}
.months a span{font:700 12px var(--font);color:var(--t3)}
.months a:hover{background:var(--s2)}
.months a[aria-current]{box-shadow:inset 0 0 0 3px var(--lime)}
.datebox{display:flex;flex-direction:column;gap:10px}
.datebox label{font-size:13px;font-weight:800;color:var(--t2)}
.datebox input,.datebox select{appearance:none;min-height:50px;padding:0 14px;background:var(--bg);border:2px solid var(--bd2);color:var(--t1);font:700 16px var(--font);border-radius:0;width:100%}
.hours.compact .hour{min-height:96px}
td .chip,th .chip{white-space:normal}
/* Chữ dài (link trần, từ không ngắt) không đẩy trang cuộn ngang ở 320–390px. */
.prose,.answer,.faq,.note,.apply,.tip,.card,.kv,.fine,.muted,.verdict-line,.article-head h1{overflow-wrap:anywhere}
/* Bảng nằm trong khung cuộn ngang riêng (.table-wrap): giữ chữ nguyên từ, không bẻ từng ký tự. */
table{overflow-wrap:normal}
/* Vùng bấm ≥ 44px cho mọi link dạng chip / danh sách. */
a.chip,.subnav a,.crumb a,.toc a,footer.site li a,.mini-days a,.pager a{min-height:44px}
/* Máy hẹp (≤ 400px): đầu trang một hàng — ẩn nhãn "Kiến thức" cạnh logo (mục đang xem đã có ở hàng chuyên mục). */
.nav .btn,.logo small{white-space:nowrap}
@media (max-width:400px){.logo small{display:none}.nav .bar{gap:10px}.nav .btn{padding:0 14px}}

/* ── Mùa Tết 2027 (tools/kien_thuc/kt_2027.dart) ── */
/* Dải mùa Tết dưới đầu trang mọi trang Kiến thức (trang động do hàm kienThuc vẽ dùng cùng lớp .season-bar). */
.season-bar{display:flex;align-items:center;justify-content:center;min-height:44px;padding:8px 16px;text-align:center;font:800 15px/1.35 var(--font);color:#FFE9A8;text-decoration:none;
  background:linear-gradient(90deg,#6E1023,#A3192F 50%,#6E1023);box-shadow:inset 0 -2px 0 var(--gold)}
.season-bar:hover,.season-bar:focus-visible{color:#fff;text-decoration:underline;text-underline-offset:3px}
.season-bar[aria-current]{color:#fff}
section.qa{padding-block:32px 0}
.direct{margin-top:12px;padding:2px 0 2px 16px;border-left:4px solid var(--gold);font-size:17px;line-height:1.65;color:var(--t1);max-width:46em;overflow-wrap:anywhere}
.direct strong{color:var(--gold)}
.y27-tools{display:flex;flex-wrap:wrap;gap:10px 22px;align-items:flex-end;margin-top:16px}
.y27-tools .datebox{min-width:220px}
.y27-tools fieldset{border:0;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:0 16px;align-items:center}
.y27-tools legend{font-size:13px;font-weight:800;color:var(--t2);padding:0;margin-bottom:2px}
.y27-tools label{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-weight:700;color:var(--t1);cursor:pointer}
.y27-tools input[type=checkbox]{width:20px;height:20px;accent-color:var(--lime)}
.y27-tools .fine{margin-bottom:12px}
table.y27 thead th button{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:4px;min-height:44px;font:inherit;color:inherit;letter-spacing:inherit;text-transform:inherit}
table.y27 thead th button:focus-visible{outline:3px solid var(--lime);outline-offset:2px}
table.y27 thead th button::after{content:"↕";opacity:.55}
table.y27 th[aria-sort=ascending] button::after{content:"↑";opacity:1}
table.y27 th[aria-sort=descending] button::after{content:"↓";opacity:1}
table.y27 thead th{padding-block:4px}
table.y27 td .chip{margin-bottom:2px}
tr.hl th a{color:var(--gold)}
.countdown{margin-top:14px;display:inline-block;padding:10px 16px;background:linear-gradient(90deg,#6E1023,#A3192F);color:#FFE9A8;font:800 18px/1.3 var(--disp);--cut:10px}
.y27-band{margin:24px 0 8px;display:grid;grid-template-columns:1fr 1.1fr;gap:18px;align-items:center;padding:22px;background:linear-gradient(135deg,#5A1430,#2C1C5A 72%);box-shadow:inset 0 0 0 3px var(--gold);--cut:18px}
.y27-band .eyebrow{color:var(--gold)}
.y27-band h2{font-size:clamp(24px,3vw,32px);margin-top:4px}
.y27-band p{color:var(--t2);margin-top:6px}
.y27-links{display:flex;flex-direction:column;gap:8px}
.y27-links a{display:flex;justify-content:space-between;align-items:center;gap:10px;min-height:48px;padding:8px 14px;background:rgba(19,10,43,.55);color:var(--t1);text-decoration:none;font-weight:800;--cut:8px}
.y27-links a span{font-size:12px;color:var(--t3);font-weight:700;white-space:nowrap}
.y27-links a:hover{background:var(--s2)}
@media (max-width:760px){.y27-band{grid-template-columns:minmax(0,1fr)}}
/* Bảng xếp chồng một cột trên di động (ô dài: sao hạn, giờ, lý do). */
@media (max-width:640px){table.stack.one tr{grid-template-columns:minmax(0,1fr)}table.stack.one td[data-label]{grid-column:1}}
@media (max-width:520px){.kv.y27kv{grid-template-columns:1fr 1fr}}
.reading{max-width:792px}
@media (max-width:640px){table.stack.y27 tr{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
/* Bảng 63 năm sinh: máy rộng giữ chữ trên một dòng (khung cuộn ngang khi hẹp), di động xếp thẻ. */
@media (min-width:641px){table.y27{min-width:980px}table.y27 .chip{white-space:nowrap}table.y27 tbody th a{white-space:nowrap}}