@import url("https://fonts.googleapis.com/css2?family=Noto+Serif:wght@600;700&display=swap");
/* Tuy Giang Ho — website huong dan (14/10/2026). Trang tinh, KHONG chua du lieu / code game (luat 0b AGENTS.md). */
:root{--nen:#14100c;--nen2:#1f1912;--the:#271f16;--vien:#4a3a26;--chu:#efe4cf;--mo:#b7a684;--vang:#e2b552;--vang2:#f6d58a;--do:#c8553d;--xanh:#6fae8f;--lam:#6c9bd1}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--nen);color:var(--chu);font:16px/1.65 "Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
 background-image:radial-gradient(ellipse at top,#2a1f13 0%,var(--nen) 60%)}
a{color:var(--vang2)}a:hover{color:#fff}
img{max-width:100%}
.dau{position:sticky;top:0;z-index:10;background:rgba(20,16,12,.94);border-bottom:1px solid var(--vien);backdrop-filter:blur(6px)}
.dau .khung{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:10px 16px;max-width:1080px;margin:0 auto}
.logo{font-family:"Noto Serif","Times New Roman",serif;font-size:21px;font-weight:700;color:var(--vang);text-decoration:none;letter-spacing:.5px}
.logo small{display:block;font:11px/1 "Segoe UI",Arial,sans-serif;color:var(--mo);letter-spacing:2px;text-transform:uppercase}
.menu{display:flex;gap:4px;flex-wrap:wrap;margin-left:auto}
.menu a{color:var(--chu);text-decoration:none;padding:6px 11px;border-radius:6px;font-size:14.5px}
.menu a:hover,.menu a.on{background:var(--the);color:var(--vang2)}
.khung{max-width:1080px;margin:0 auto;padding:0 16px}
.bia{text-align:center;padding:56px 16px 40px}
.bia h1{font-family:"Noto Serif","Times New Roman",serif;font-size:clamp(34px,7vw,58px);margin:0;color:var(--vang);text-shadow:0 2px 18px rgba(226,181,82,.25)}
.bia p{color:var(--mo);max-width:640px;margin:14px auto 22px;font-size:17px}
.nut{display:inline-block;background:linear-gradient(#e9be5e,#b8862f);color:#1d1408;font-weight:700;text-decoration:none;padding:11px 22px;border-radius:8px;margin:4px}
.nut.phu{background:none;border:1px solid var(--vang);color:var(--vang2)}
.luoi{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px;margin:18px 0 36px}
.the{background:var(--the);border:1px solid var(--vien);border-radius:10px;padding:16px 18px;text-decoration:none;color:var(--chu);display:block}
a.the:hover{border-color:var(--vang);transform:translateY(-2px);transition:.15s}
.the h3{margin:0 0 6px;color:var(--vang2);font-size:18px}
.the p{margin:0;color:var(--mo);font-size:14.5px}
.the .so{font-size:28px}
h2{font-family:"Noto Serif","Times New Roman",serif;color:var(--vang);font-size:26px;margin:38px 0 10px;border-bottom:1px solid var(--vien);padding-bottom:6px}
h3{color:var(--vang2);margin:24px 0 6px}
.bai{max-width:820px;margin:0 auto;padding:26px 16px 50px}
.bai h1{font-family:"Noto Serif","Times New Roman",serif;color:var(--vang);font-size:clamp(28px,5vw,40px);margin:8px 0 4px}
.bai .tom{color:var(--mo);font-size:17px;margin-bottom:8px}
.muc-luc{background:var(--nen2);border:1px solid var(--vien);border-radius:10px;padding:12px 18px;margin:18px 0}
.muc-luc b{color:var(--vang2)}.muc-luc ol{margin:6px 0 0;padding-left:22px}
.hop{border-left:4px solid var(--vang);background:var(--nen2);padding:10px 14px;border-radius:0 8px 8px 0;margin:14px 0}
.hop.chu-y{border-color:var(--do)}.hop.meo{border-color:var(--xanh)}
.hop b:first-child{color:var(--vang2)}
table{width:100%;border-collapse:collapse;margin:12px 0;font-size:15px;display:block;overflow-x:auto}
th,td{border:1px solid var(--vien);padding:7px 10px;text-align:left;vertical-align:top}
th{background:var(--the);color:var(--vang2);white-space:nowrap}
tr:nth-child(even) td{background:rgba(255,255,255,.02)}
.buoc{counter-reset:b;list-style:none;padding:0}
.buoc li{counter-increment:b;position:relative;padding:4px 0 10px 44px}
.buoc li::before{content:counter(b);position:absolute;left:0;top:2px;width:30px;height:30px;border-radius:50%;background:var(--vang);color:#1d1408;font-weight:700;display:flex;align-items:center;justify-content:center}
.nhan{display:inline-block;font-size:12.5px;padding:1px 8px;border-radius:10px;background:var(--the);border:1px solid var(--vien);color:var(--mo);margin-right:4px}
.p-thuong{color:#e8e8e8}.p-uutu{color:#7bd389}.p-tl{color:#6ab0ff}.p-st{color:#d58cff}.p-ct{color:#ffb347}
.chan{border-top:1px solid var(--vien);color:var(--mo);font-size:13.5px;text-align:center;padding:22px 16px 30px}
.dieu-huong{display:flex;justify-content:space-between;gap:10px;margin-top:36px;flex-wrap:wrap}
@media (max-width:640px){.menu{width:100%;margin-left:0}.menu a{padding:5px 8px;font-size:14px}.bia{padding:36px 16px 26px}}
.bai.rong{max-width:1000px}
.bo-luoi{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px;margin:10px 0 22px}
.bo-luoi figure{margin:0;background:var(--the);border:1px solid var(--vien);border-radius:10px;padding:10px 6px 6px;text-align:center}
.bo-luoi img{height:112px;width:auto;image-rendering:pixelated;margin:0 4px;vertical-align:bottom}
.bo-luoi figcaption{color:var(--vang2);font-size:14px;margin-top:6px}
.luoi.vk figure{margin:0;text-align:center;padding:10px}
.luoi.vk img{width:100%;max-width:300px;image-rendering:pixelated;border-radius:6px}
.luoi.vk figcaption{margin-top:6px;color:var(--mo)}
.bia{background:linear-gradient(rgba(14,10,6,0) 35%,rgba(20,16,12,.97)),url("anh/bia.webp") center top/cover no-repeat;border-bottom:1px solid var(--vien);min-height:min(56vw,600px);display:flex;flex-direction:column;justify-content:flex-end;align-items:center}
.an-chu{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.bia h1{text-shadow:0 3px 22px #000}.bia p{color:#e9dcc0;text-shadow:0 1px 8px #000}
.video{display:block;width:100%;max-width:820px;margin:16px auto 30px;border-radius:12px;border:1px solid var(--vien);background:#000}

@media (max-width:700px){.bia{background:linear-gradient(rgba(20,16,12,0) 0,rgba(20,16,12,0) 50vw,var(--nen) 58vw),url("anh/bia.webp") center top/100% auto no-repeat;padding-top:56vw;min-height:0}}
.phai-hinh{display:flex;justify-content:center;gap:14px;background:radial-gradient(ellipse at 50% 85%,#3b2c18 0,var(--the) 70%);border-radius:8px;padding:12px 0 6px;margin-bottom:8px}
.phai-hinh img{height:150px;width:auto;image-rendering:pixelated}
.sk-doan{margin:6px 0 14px}.sk-doan p{margin:3px 0}
.vip td:first-child{white-space:nowrap;color:var(--vang2);font-weight:700}
.nut-hang{display:flex;flex-wrap:wrap;justify-content:center;gap:4px}
.menu a.tai{background:linear-gradient(#e9be5e,#b8862f);color:#1d1408;font-weight:700}.menu a.tai:hover{filter:brightness(1.08);color:#1d1408}