/* xosohomnay.com (23/10/2026) — mobile first (>= 900px 2 cột không cần: bảng miền Nam 3-4 cột đã rộng, máy tính chỉ nới chữ). Nền xám lạnh rất nhạt, thẻ trắng viền mảnh, không gradient / bóng đổ.
   Tông đỏ (chủ project 23/10): sáng = đỏ + trắng, tối = đỏ + đen. --chinh #b4121f = thương hiệu, mục đang chọn, nút; --chinh2 link; --do (ĐB, trực tiếp) đỏ tươi hơn, nổi nhờ cỡ chữ; mỗi miền 1 màu dịu ở vạch tiêu đề + đầu bảng (.m-xsmn xanh lục, .m-xsmt hổ phách, .m-xsmb chàm).
   Số kết quả: đậm, tabular-nums, ĐB to hơn; ô chờ xám (.cho), ô đang quay vàng (.quay). Biến màu ở :root, [data-theme="dark"] đặt lại. */
:root { --chinh: #b4121f; --chinh2: #c41e2b; --do: #e0202c; --vang: #f5b800; --vang2: #fff3cc; --chu: #1a1d2b; --mo: #686d7a; --vien: #e3e5ec; --vieno: #c5c9d4;
	--nen: #fff; --nen2: #f3f4f8; --nen3: #eef0f5; --hang: #f8f9fc; --o: #fff; --mien: var(--chinh) }
* { box-sizing: border-box }
html { -webkit-text-size-adjust: 100% }
body { margin: 0; font: 15px/1.5 "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; color: var(--chu); background: var(--nen2); font-variant-numeric: tabular-nums }
a { color: var(--chinh2) }
img { max-width: 100%; height: auto }
.khung { max-width: 960px; margin: 0 auto; padding: 0 12px }
:focus-visible { outline: 2px solid var(--chinh2); outline-offset: 2px }

/* đầu trang */
.dau { background: var(--nen); border-bottom: 1px solid var(--vien) }
.dau .khung { display: flex; align-items: center; gap: 10px; padding-top: 9px; padding-bottom: 9px }
.logo { display: flex; align-items: center; gap: 9px; color: var(--chu); text-decoration: none; min-width: 0 }
.logo svg { flex: none; width: 36px; height: 36px }
.logo b { display: block; font-size: 17px; line-height: 1.1; color: var(--chinh); letter-spacing: .2px }
.logo i { display: block; font-style: normal; font-size: 12px; color: var(--mo) }
.ttlink { margin-left: auto; display: flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 700; color: var(--mo); text-decoration: none; padding: 6px 10px; border: 1px solid var(--vien); border-radius: 20px; white-space: nowrap }
.ttlink .cham { width: 8px; height: 8px; border-radius: 50%; background: var(--vieno) }
.ttlink.live { color: #fff; background: var(--do); border-color: var(--do); animation: nhay 1.2s infinite } /* đang quay: cả nút đỏ nhấp nháy như nhãn Đang quay (chủ project 23/10) */
.ttlink.live .cham { background: #fff }
@keyframes nhay { 0% { box-shadow: 0 0 0 0 rgba(214, 35, 43, .45) } 70% { box-shadow: 0 0 0 7px rgba(214, 35, 43, 0) } 100% { box-shadow: 0 0 0 0 rgba(214, 35, 43, 0) } }
.doimau { flex: none; width: 34px; height: 34px; border-radius: 50%; border: 1px solid var(--vien); background: var(--nen3); color: var(--chu); cursor: pointer; display: flex; align-items: center; justify-content: center; padding: 0 }
.doimau svg { width: 17px; height: 17px }
.doimau .mt { display: none }
[data-theme="dark"] .doimau .mt { display: block }
[data-theme="dark"] .doimau .ms { display: none }
.menu { background: var(--nen); border-bottom: 1px solid var(--vien); position: relative }
.menu .khung { display: flex; overflow-x: auto; scrollbar-width: none; padding: 0 4px }
.menu .khung::-webkit-scrollbar { display: none }
.menu a { color: var(--chu); text-decoration: none; font-weight: 600; font-size: 14px; padding: 11px 11px; white-space: nowrap; border-bottom: 3px solid transparent; margin-bottom: -1px }
.menu a.on { color: var(--chinh2); border-bottom-color: var(--chinh2) }
.menu::before, .menu::after { content: '‹'; position: absolute; top: 0; bottom: 0; left: 0; width: 30px; pointer-events: none; opacity: 0; transition: opacity .2s; display: flex; align-items: center; padding-left: 4px; font-size: 20px; font-weight: 700; color: var(--chinh2); background: linear-gradient(90deg, var(--nen) 40%, transparent) }
.menu::after { content: '›'; left: auto; right: 0; justify-content: flex-end; padding: 0 4px 0 0; background: linear-gradient(270deg, var(--nen) 40%, transparent) }
.menu.con-trai::before, .menu.con-phai::after { opacity: 1 }

/* thân */
.than { padding-top: 12px; padding-bottom: 28px }
h1 { font-size: 19px; line-height: 1.3; margin: 2px 0 10px; font-weight: 700 }
h2.muc { font-size: 17px; margin: 18px 0 8px }
.the { background: var(--nen); border: 1px solid var(--vien); border-radius: 12px; overflow: hidden; margin-bottom: 12px }
.the h2 { margin: 0; font-size: 16px; line-height: 1.3; font-weight: 700 }
.the h2 a { color: inherit; text-decoration: none }
.the h2 small { font-weight: 400; color: var(--mo); font-size: 13px }
.dauthe { display: flex; align-items: center; gap: 10px; padding: 10px 12px 8px }
.dauthe > div { min-width: 0; border-left: 3px solid var(--mien); padding-left: 10px; flex: 1 }
.ky { margin: 0; font-size: 12.5px; color: var(--mo) }
.nhan { flex: none; font-size: 12px; font-weight: 700; padding: 4px 10px; border-radius: 14px; background: var(--nen3); color: var(--mo); text-decoration: none }
.nhan.xong { background: #e6f4ea; color: #0f7a35 }
.nhan.live { background: var(--do); color: #fff; animation: nhay 1.2s infinite }
/* tờ lịch nhỏ .tolich góc phải thẻ kết quả (mẫu 3, 23/10): băng tháng màu miền, số ngày to — KHÔNG đặt tên .lich (trùng bảng lịch quay table.lich) */
.tolich { flex: none; width: 44px; border: 1px solid var(--vien); border-radius: 8px; overflow: hidden; text-align: center; line-height: 1; background: var(--nen) }
.tolich small { display: block; background: var(--mien, var(--chinh)); color: #fff; font-size: 11px; font-weight: 700; padding: 3px 0 }
.the.vl .tolich small { background: var(--vl, var(--chinh)) }
.the.vl.tt .dauthe > div.phai { margin-left: auto; flex: none; display: flex; flex-direction: column; align-items: flex-end; gap: 4px; border-left: 0; padding-left: 0 } /* thẻ trực tiếp: tờ lịch + nhãn trạng thái xếp dọc góc phải, chừa chỗ cho tiêu đề (23/10) */
.tolich b { display: block; font-size: 18px; padding: 5px 0 4px; color: var(--chu) }
.m-xsmn { --mien: #b4121f } /* miền Nam dùng tông đỏ của site làm màu chủ đạo (chủ project 23/10) */
.m-xsmt { --mien: #b45309 }
.m-xsmb { --mien: #1f2a6b }
.ghichu { font-size: 13px; color: var(--mo); margin: 0; padding: 0 12px 12px }
.chukq { font-size: 13.5px; line-height: 1.55; color: var(--mo); margin: 0; padding: 8px 12px 4px } .chukq b { color: var(--chu) } .chukq a { font-weight: 700 }
.xemthem { display: block; text-align: center; padding: 10px; border-top: 1px solid var(--vien); text-decoration: none; font-weight: 600; font-size: 14px }
.xemthemtk { font-size: 14px; color: var(--mo); margin: 4px 0 14px }
.cuon { overflow-x: auto }

/* bảng kết quả */
table.kq { width: 100%; border-collapse: collapse; table-layout: fixed }
table.kq th, table.kq td { border-top: 1px solid var(--vien); padding: 6px 3px; text-align: center; vertical-align: middle }
table.kq th { font-size: 13px; font-weight: 700; color: var(--mien); background: var(--hang); padding: 8px 4px }
table.kq th a { color: inherit; text-decoration: none }
table.kq th .mave { display: block; font-size: 11px; font-weight: 600; color: var(--mo); line-height: 1.2; margin-top: 1px } table.kq th .mave:empty { display: none }
table.kq td.g, table.kq th.g { width: 38px; font-size: 12px; font-weight: 700; color: var(--mo); background: var(--hang); text-align: center }
table.kq b { display: block; font-weight: 700; font-size: 19px; line-height: 1.35; letter-spacing: .3px; border-radius: 4px }
table.kq.c4 b { font-size: 17px }
table.kq .r-db b { color: var(--do); font-size: 24px }
table.kq.c4 .r-db b { font-size: 21px }
table.kq .r-8 b, table.kq .r-7 b { color: var(--chinh2) }
table.kq b.to { background: var(--vang2); color: var(--chu); outline: 2px solid var(--vang) }
table.kq i.cho { display: block; height: 20px; margin: 2px auto; width: 60%; max-width: 64px; border-radius: 4px; background: var(--nen3) }
table.kq b.quay { background: var(--vang2); color: var(--chu) }
table.kq td.moi b { animation: moi 1.5s }
/* dòng chờ quay trên bảng trống (23/10): 1 vòng xoay CSS nhẹ; ô chờ mờ hơn */
.khungcho { position: relative }
.choquay { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; padding: 16px; background: color-mix(in srgb, var(--nen) 72%, transparent); font-size: 13px; color: var(--mo); text-align: center }
.choquay .hop { display: grid; justify-items: center; gap: 6px; max-width: 320px; padding: 14px 18px; border-radius: 12px; background: var(--nen); border: 1px solid var(--vien); box-shadow: 0 6px 24px rgba(0, 0, 0, .12) }
.choquay b { color: var(--chu); font-size: 15px }
.choquay em { font-style: normal; font-weight: 700; color: var(--do); font-size: 14px }
.choquay .xoay { width: 22px; height: 22px; border-radius: 50%; border: 3px solid var(--vien); border-top-color: var(--mien, var(--chinh)); animation: xoay 1s linear infinite }
@keyframes xoay { to { transform: rotate(360deg) } }
.the.tt table.kq i.cho { opacity: .55 }
@keyframes moi { 0% { background: var(--vang2) } 100% { background: transparent } }
/* miền Bắc: nhiều số 1 hàng */
table.kq.b td:not(.g) { text-align: left; padding: 6px 8px }
table.kq.b b, table.kq.b i.cho { display: inline-block; min-width: 56px; margin: 2px 2px 2px 0; text-align: center } /* margin phải 2px + khoảng trắng ~4px giữa các số = như 6px cũ */
table.kq.b .r-db b { min-width: 90px }
table.kq.b .r-7 b { min-width: 38px }
table.kq.b .r-6 b { min-width: 46px }
.kh { display: inline-block; font-size: 12px; font-weight: 700; padding: 2px 7px; margin: 2px 4px 2px 0; border-radius: 4px; background: var(--nen3); color: var(--mo) }
.kh.cho { width: 34px; height: 18px }
.kh.ghi { background: transparent; color: var(--mo); font-weight: 400; padding: 0 }
/* lô tô */
details.lt { border-top: 1px solid var(--vien) }
details.lt summary { cursor: pointer; padding: 9px 12px; font-size: 14px; font-weight: 600; color: var(--chinh2); list-style: none }
details.lt summary::before { content: '▸ '; font-size: 12px }
details[open].lt summary::before { content: '▾ ' }
table.loto { width: 100%; border-collapse: collapse; font-size: 14px; margin-bottom: 4px }
table.loto th, table.loto td { border-top: 1px solid var(--vien); padding: 5px 6px; text-align: left; vertical-align: top }
table.loto th { font-size: 12px; color: var(--mo); background: var(--hang) }
table.loto td.g { width: 44px; text-align: center; font-weight: 700; color: var(--mo); background: var(--hang) }
table.loto td b { font-weight: 600 }
table.loto td span { color: var(--vieno) }
table.loto td i { color: var(--vieno); font-style: normal }
/* thanh ngày */
nav.ngay { display: grid; gap: 8px; margin: 0 0 12px }
nav.ngay .ds { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; padding-bottom: 2px }
nav.ngay .ds::-webkit-scrollbar { display: none }
nav.ngay .ds a { flex: none; display: grid; text-align: center; padding: 6px 10px; border-radius: 10px; border: 1px solid var(--vien); background: var(--nen); text-decoration: none; color: var(--chu); font-weight: 700; font-size: 14px; line-height: 1.2 }
nav.ngay .ds a small { font-weight: 400; color: var(--mo); font-size: 11px }
nav.ngay .ds a.on { background: var(--chinh2); border-color: var(--chinh2); color: #fff }
nav.ngay .ds a.on small { color: #e8ebff }
nav.ngay .ds a.live { border-color: var(--do); color: var(--do) } nav.ngay .ds a.live.on { background: var(--do); border-color: var(--do); color: #fff } nav.ngay .ds a.live.on small { color: #ffd9db } /* nút Live đầu thanh ngày trang miền (23/10) */
nav.ngay form.chon { display: flex; gap: 8px }
nav.ngay input { flex: 1; height: 40px; border: 1px solid var(--vieno); border-radius: 8px; padding: 0 10px; font-size: 15px; background: var(--o); color: var(--chu) }
.nut { display: inline-block; background: var(--chinh2); color: #fff !important; border: 0; border-radius: 8px; height: 42px; padding: 0 16px; font-weight: 700; font-size: 15px; cursor: pointer; text-decoration: none; line-height: 42px }
.nut.nho { height: 40px; line-height: 40px; padding: 0 14px }
/* trực tiếp */
.ttchu { display: flex; align-items: center; gap: 10px; margin: 0 0 12px; padding: 9px 12px; border-radius: 10px; background: var(--nen); border: 1px solid var(--vien); font-size: 14px; color: var(--mo) }
.ttchu .cham { width: 10px; height: 10px; border-radius: 50%; background: var(--vieno); flex: none }
.ttchu.run { color: var(--chu) }
.ttchu.run .cham { background: var(--do); animation: nhay 1.2s infinite }
.ttchu.done .cham { background: #0f7a35 }
.ttchu.loi { color: var(--do) }
/* Vietlott gọn */
.vlds { display: grid; gap: 10px; margin-bottom: 4px }
.the.vl .dauthe > div { border-left-color: var(--chinh) }
.jp { flex: none; text-align: right; font-weight: 800; color: var(--do); font-size: 15px; line-height: 1.2 }
.jp small { display: block; font-weight: 400; color: var(--mo); font-size: 11px }
/* thẻ gọn trang chủ (.vlds): Jackpot xuống hàng riêng dưới tiêu đề, không chen ngang với ngày kỳ khi thẻ hẹp (chủ project 23/10) */
.vlds .dauthe { flex-wrap: wrap } .vlds .jp { flex: 1 0 100%; text-align: left; padding-left: 13px; display: flex; align-items: baseline; gap: 6px } .vlds .jp small { display: inline }
.bong { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 7px; padding: 4px 12px 12px; container-type: inline-size } /* align-items flex-start: bóng không bị kéo giãn theo hàng -> tròn đúng aspect-ratio (chủ project 23/10: bóng méo) */ /* bóng: tối đa 7 quả 1 hàng (Power 6/55 = 7), co theo bề rộng (chủ project 23/10: bóng thứ 7 rớt dòng) */
.bong b { flex: none; width: min(38px, calc((100% - 42px) / 7)); aspect-ratio: 1; height: auto; line-height: 1; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 17px; background: var(--chinh); color: #fff }
.bong b.db { background: var(--vang); color: #3a2b00 }
.b3 { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; padding: 4px 12px 12px }
.b3 .g { font-size: 12px; font-weight: 700; color: var(--mo); margin: 0 3px 0 2px }
.b3 b { background: var(--nen3); border-radius: 6px; padding: 3px 7px; font-size: 15px; letter-spacing: .5px }
.b3 b.db { background: var(--do); color: #fff }
table.kq.vlb { table-layout: auto }
table.kq.vlb td { text-align: left }
table.kq.vlb td.g { width: 64px; font-size: 12px; line-height: 1.3 }
table.kq.vlb td.g small { display: block; font-weight: 400 }
table.kq.vlb td b { display: inline-block; width: 30px; height: 30px; line-height: 30px; border-radius: 50%; background: var(--chinh); color: #fff; font-size: 14px; margin: 1px 2px 1px 0; text-align: center }
table.kq.vlb td b.db { background: var(--vang); color: #3a2b00 }
table.kq.vlb td.tien { text-align: right; font-weight: 700; color: var(--do); white-space: nowrap; font-size: 13px }
/* lịch quay */
table.lich { width: 100%; border-collapse: collapse; font-size: 13.5px }
table.lich th, table.lich td { border-top: 1px solid var(--vien); padding: 8px 6px; text-align: left; vertical-align: top }
table.lich th { background: var(--hang); font-size: 12px; color: var(--mo) }
table.lich th small, table.lich td.g small { display: block; font-weight: 400; color: var(--mo) }
table.lich td.g { font-weight: 700; white-space: nowrap }
table.lich tr.on td { background: var(--vang2) }
table.lich a { text-decoration: none }
/* văn bản */
.vanban { padding: 12px 14px; line-height: 1.6 }
.vanban h2 { margin: 0 0 8px; font-size: 16px }
.vanban ul { padding-left: 20px; margin: 6px 0 }
.vanban li { margin: 4px 0 }
.vanban p { margin: 8px 0 0 }
/* chân trang */
.chan { background: var(--nen); border-top: 1px solid var(--vien); color: var(--mo); font-size: 13px; padding: 16px 0 24px }
.chan .cotdai { display: grid; gap: 12px; margin-bottom: 12px }
.chan h3 { margin: 0 0 2px; font-size: 14px }
.chan h3 a { color: var(--chu); text-decoration: none }
.chan .cotdai p { margin: 0; line-height: 1.8 }
.chan .cotdai a { text-decoration: none }
.chan p { margin: 4px 0 }
.chan b { color: var(--chu) }

@media (min-width: 720px) {
	h1 { font-size: 24px }
	.logo b { font-size: 19px }
	.menu a { font-size: 15px; padding: 12px 14px }
	table.kq b { font-size: 22px }
	table.kq.c4 b { font-size: 20px }
	table.kq .r-db b, table.kq.c4 .r-db b { font-size: 28px }
	table.kq td.g, table.kq th.g { width: 48px; font-size: 13px }
	.vlds { grid-template-columns: repeat(3, 1fr) }
	.chan .cotdai { grid-template-columns: repeat(3, 1fr) }
	nav.ngay { grid-template-columns: 1fr auto }
	.bong b { width: min(42px, calc((100% - 42px) / 7)); font-size: 18px }
}
@media (prefers-reduced-motion: reduce) { .nhan.live, .ttlink.live, .ttchu.run .cham, .choquay .xoay { animation: none } table.kq td.moi b { animation: none } }

[data-theme="dark"] { --chu: #ececee; --mo: #a0a1a8; --vien: #2a2a2e; --vieno: #48484e; --nen: #171718; --nen2: #0e0e0f; --nen3: #232326; --hang: #1c1c1e; --o: #232326; --vang2: #3a3110; --chinh: #e23744; --chinh2: #ff8a90; color-scheme: dark }
[data-theme="dark"] a, [data-theme="dark"] .menu a.on, [data-theme="dark"] .logo b, [data-theme="dark"] table.kq .r-8 b, [data-theme="dark"] table.kq .r-7 b, [data-theme="dark"] details.lt summary { color: #ff8a90 }
[data-theme="dark"] table.kq .r-db b, [data-theme="dark"] .jp, [data-theme="dark"] table.kq.vlb td.tien { color: #ff4d55 }
[data-theme="dark"] table.kq th { color: #d2d2d7 }
[data-theme="dark"] .m-xsmn { --mien: #ff8a90 } [data-theme="dark"] .m-xsmt { --mien: #f0a04b } [data-theme="dark"] .m-xsmb { --mien: #9fb0ff }
[data-theme="dark"] .nhan.xong { background: #143d22; color: #8fe0ab }
[data-theme="dark"] table.kq b.to, [data-theme="dark"] table.kq b.quay { color: #ffe08a }
[data-theme="dark"] nav.ngay .ds a.on { background: #b4121f; border-color: #b4121f }

/* 1 đài (trang đài): số xếp ngang như miền Bắc cho đỡ dài */
table.kq.c1 td:not(.g) { text-align: left; padding: 6px 10px }
table.kq.c1 b, table.kq.c1 i.cho { display: inline-block; min-width: 64px; margin: 2px 4px 2px 0; text-align: center }
table.kq.c1 .r-db b { min-width: 96px }

/* Bố cục máy tính 2 cột (23/10/2026, chủ project: site thương hiệu chính, đủ chức năng): >= 960px nội dung + cột phải 320px dính; điện thoại cột phải xếp dưới nội dung. Trang trực tiếp 1 cột ($khongPhai). */
.phai { margin-top: 6px }
.hop { background: var(--nen); border: 1px solid var(--vien); border-radius: 12px; margin-bottom: 12px; overflow: hidden }
.hop h3 { margin: 0; font-size: 14px; padding: 10px 12px 6px; color: var(--chu) }
.hop h3 a { color: inherit; text-decoration: none }
.hop ul { list-style: none; margin: 0; padding: 0 12px 10px; font-size: 13.5px }
.hop li { padding: 6px 0; border-bottom: 1px solid var(--vien) }
.hop li:last-child { border-bottom: 0 }
.hop ul a { text-decoration: none }
.hop .homnay a { display: grid; grid-template-columns: 52px 1fr; gap: 2px 8px; color: var(--chu); align-items: center }
.hop .homnay b { color: var(--chinh2) }
.hop .homnay .nhan { justify-self: start; padding: 2px 8px; font-size: 11px }
.hop .homnay small { grid-column: 1 / -1; color: var(--mo); font-size: 12px }
.luoi100 { display: grid; grid-template-columns: repeat(10, 1fr); gap: 3px; padding: 0 12px 12px }
.luoi100 a { text-align: center; font-size: 12.5px; font-weight: 600; padding: 4px 0; border-radius: 5px; background: var(--nen3); color: var(--chu); text-decoration: none }
.luoi100 a:hover { background: var(--chinh2); color: #fff }
.hop .jpds a { display: flex; justify-content: space-between; gap: 8px; color: var(--chu) }
.hop .jpds span { font-weight: 700; color: var(--do) }
@media (min-width: 960px) {
	.khung { max-width: 1120px }
	.than { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 20px; align-items: start; padding-top: 16px }
	.than > main { min-width: 0 }
	.phai { margin-top: 0; position: sticky; top: 12px }
	.vlds { grid-template-columns: repeat(3, 1fr) }
	.chan .cotdai { grid-template-columns: repeat(3, 1fr) }
}
[data-theme="dark"] .hop .jpds span { color: #ff7a80 }

/* Điểm màu đặc trưng (23/10/2026, chủ project: "đơn giản nhưng màu sắc, điểm nhẹ màu của loại xổ số"): mỗi miền 1 tông ở đầu bảng (nền nhạt), G8 / G7 và nhãn; mỗi trò Vietlott 1 tông ở vạch tiêu đề + bóng số. Đỏ vẫn chỉ cho ĐB. */
.m-xsmn { --mien: #b4121f; --mien2: #fbe9ea }
.m-xsmt { --mien: #b45309; --mien2: #fdf1e3 }
.m-xsmb { --mien: #1f2a6b; --mien2: #e8ebf7 }
table.kq th { background: var(--mien2, var(--hang)); color: var(--mien) }
table.kq th.g, table.kq td.g { background: var(--mien2, var(--hang)); color: var(--mien) }
table.kq .r-8 b, table.kq .r-7 b { color: var(--mien) }
.the.mien .nhan.xong { background: var(--mien2); color: var(--mien) }
.v-mega-645 { --vl: #c8102e } .v-power-655 { --vl: #b4771e } .v-lotto-535 { --vl: #0f7a35 } .v-max3d { --vl: #b5156e } .v-max3d-pro { --vl: #7a1f5c } .v-keno { --vl: #d9541a } .v-bingo18 { --vl: #cf7a0f }
.the.vl .dauthe > div { border-left-color: var(--vl, var(--chinh)) }
.the.vl .bong b { background: var(--vl, var(--chinh)) }
.the.vl .b3 b.db { background: var(--vl, var(--do)) }
/* bóng đặc biệt (Lotto 5/35 bóng 6, Power bóng 7) vàng / đỏ như bản chi tiết + cột Trùng, cả thẻ gọn trang chủ (chủ project 23/10) — đè rule màu trò ở trên */
.the.vl .bong b.db { background: var(--vang); color: #3a2b00 }
.the.vl.v-power-655 .bong b.db, .v-power-655 .tbong i.db { background: var(--do); color: #fff; box-shadow: none }
.the.vl .jp { color: var(--vl, var(--do)) }
.bong b.to, .b3 b.to { box-shadow: 0 0 0 3px var(--nen), 0 0 0 6px var(--vang) }
[data-theme="dark"] .m-xsmn { --mien2: #33151a } [data-theme="dark"] .m-xsmt { --mien2: #33200c } [data-theme="dark"] .m-xsmb { --mien2: #1a2050 }
[data-theme="dark"] .the.vl .jp { color: color-mix(in srgb, var(--vl, #fff) 60%, #fff) }

/* bảng dữ liệu chung (thống kê, dò vé, Vietlott) — phần riêng từng trang ở tk.css / vl.css */
table.bang2 { width: 100%; border-collapse: collapse; font-size: 14px; margin: 6px 0 }
table.bang2 th { text-align: left; font-size: 12px; color: var(--mo); font-weight: 600; padding: 6px 6px; border-bottom: 1px solid var(--vien); white-space: nowrap; background: var(--hang) }
table.bang2 td { padding: 7px 6px; border-bottom: 1px solid var(--vien); vertical-align: middle }
table.bang2 td.tien { text-align: right; font-weight: 700; color: var(--do); white-space: nowrap }
table.bang2 th:last-child { text-align: right }

/* Cỡ chữ (23/10/2026, chủ project): nút A− / A+ đầu trang, 5 mức html[data-co="1..5"] (mặc định 3), lưu localStorage "cochu", script đầu <head> đặt trước khi vẽ.
   Biến --co nhân vào chữ thân và số kết quả (bảng 3 miền, bóng Vietlott, Keno). */
:root { --co: 1 }
html[data-co="1"] { --co: .85 } html[data-co="2"] { --co: .93 } html[data-co="4"] { --co: 1.15 } html[data-co="5"] { --co: 1.3 }
body { font-size: calc(15px * var(--co)) }
table.kq b { font-size: calc(19px * var(--co)) }
table.kq.c4 b { font-size: calc(17px * var(--co)) }
table.kq .r-db b { font-size: calc(24px * var(--co)) }
table.kq.c4 .r-db b { font-size: calc(21px * var(--co)) }
.bong b, .the.vl .bong b { font-size: min(calc(19px * var(--co)), 6.5cqw) } /* chữ co theo bề rộng khung bóng (bóng nhỏ không bị chữ đẩy méo, 23/10) */
.kenoso b { font-size: calc(14px * var(--co)) }
@media (min-width: 720px) { table.kq b { font-size: calc(22px * var(--co)) } table.kq.c4 b { font-size: calc(20px * var(--co)) } table.kq .r-db b, table.kq.c4 .r-db b { font-size: calc(28px * var(--co)) } .bong b, .the.vl .bong b { font-size: min(calc(20px * var(--co)), 6.5cqw) } }
.cochu { display: flex; flex: none; border: 1px solid var(--vien); border-radius: 18px; overflow: hidden; background: var(--nen3) }
.cochu button { border: 0; background: none; color: var(--chu); font-weight: 700; font-size: 13px; height: 34px; padding: 0 9px; cursor: pointer }
.cochu button + button { border-left: 1px solid var(--vien) }
.cochu button:disabled { opacity: .35; cursor: default }
@media (max-width: 400px) { .ttlink { padding: 6px 8px } .ttlink .cham { display: none } }
/* đầu trang điện thoại hẹp (<= 420px): bỏ dòng ngày dưới logo, nút gọn hơn để logo + Trực tiếp + A− A+ + sáng tối vừa 1 hàng */
@media (max-width: 420px) { .logo i { display: none } .logo b { white-space: nowrap; font-size: 16px } .logo svg { width: 32px; height: 32px } .dau .khung { gap: 6px } .ttlink { font-size: 12px; padding: 5px 8px } .cochu button { height: 30px; padding: 0 7px; font-size: 12px } .doimau { width: 30px; height: 30px } }

/* thuộc tính hidden luôn thắng display của class (ô theo kiểu in ở form in vé dò, option ẩn...) */
[hidden] { display: none !important }

/* Cỡ chữ A− / A+ áp cho MỌI chữ (23/10/2026, chủ project): các rule trên ghi px cố định -> đè lại bằng calc(px gốc * --co). Thêm rule px mới: nhớ nhân --co. */
.menu a { font-size: calc(14px * var(--co)) }
/* logo, link Trực tiếp, nút cỡ chữ: giữ cố định (đầu trang chật ở 375px) */

h1 { font-size: calc(19px * var(--co)) } h2.muc { font-size: calc(17px * var(--co)) } .the h2 { font-size: calc(16px * var(--co)) } .the h2 small { font-size: calc(13px * var(--co)) }
.ky { font-size: calc(12.5px * var(--co)) } .choquay { font-size: calc(13px * var(--co)) } .choquay b { font-size: calc(15px * var(--co)) } .choquay em { font-size: calc(14px * var(--co)) } .nhan { font-size: calc(12px * var(--co)) } .tolich small { font-size: calc(11px * var(--co)) } .tolich b { font-size: calc(18px * var(--co)) } .ghichu { font-size: calc(13px * var(--co)) } .chukq { font-size: calc(13.5px * var(--co)) } .xemthem, .xemthemtk { font-size: calc(14px * var(--co)) }
table.kq th { font-size: calc(13px * var(--co)) } table.kq th .mave { font-size: calc(11px * var(--co)) } table.kq td.g, table.kq th.g { font-size: calc(12px * var(--co)) } .kh { font-size: calc(12px * var(--co)) }
table.loto { font-size: calc(14px * var(--co)) } table.loto th { font-size: calc(12px * var(--co)) }
details.lt summary { font-size: calc(14px * var(--co)) }
nav.ngay .ds a { font-size: calc(14px * var(--co)) } nav.ngay .ds a small { font-size: calc(11px * var(--co)) } nav.ngay input, .nut { font-size: calc(15px * var(--co)) }
.ttchu { font-size: calc(14px * var(--co)) }
.jp { font-size: calc(15px * var(--co)) } .jp small { font-size: calc(11px * var(--co)) }
.b3 b { font-size: calc(15px * var(--co)) } .b3 .g { font-size: calc(12px * var(--co)) }
table.kq.vlb td.g, table.kq.vlb td.tien { font-size: calc(12px * var(--co)) } table.kq.vlb td b { font-size: calc(14px * var(--co)) }
table.lich { font-size: calc(13.5px * var(--co)) } table.lich th { font-size: calc(12px * var(--co)) }
.vanban h2 { font-size: calc(16px * var(--co)) }
table.bang2 { font-size: calc(14px * var(--co)) } table.bang2 th { font-size: calc(12px * var(--co)) }
.chan { font-size: calc(13px * var(--co)) } .chan h3 { font-size: calc(14px * var(--co)) }
.hop h3 { font-size: calc(14px * var(--co)) } .hop ul { font-size: calc(13.5px * var(--co)) } .hop .homnay small { font-size: calc(12px * var(--co)) } .hop .homnay .nhan { font-size: calc(11px * var(--co)) } .luoi100 a { font-size: calc(12.5px * var(--co)) }
.the.vl .chip, .chip { font-size: calc(13px * var(--co)) }
.cochu button { font-size: 13px } /* nút cỡ chữ giữ cố định */
@media (min-width: 720px) { h1 { font-size: calc(24px * var(--co)) } .menu a { font-size: calc(15px * var(--co)) } table.kq td.g, table.kq th.g { font-size: calc(13px * var(--co)) } }
/* khung module / quảng cáo admin (vị trí 888-890), chỉ in khi có module */
.qc { margin: 0 0 12px }
.qc:empty { display: none }
.nb { white-space: nowrap } /* thứ + ngày trên 1 hàng (chủ project 23/10) */
