:root{--bg:#f8fafc;--card:#fff;--ink:#0f172a;--muted:#64748b;--brand:#2563eb}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.5 system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial}
.wrap{max-width:1000px;margin:0 auto;padding:16px}
h1{margin:0 0 12px;font-size:22px}
.card{background:var(--card);border:1px solid #e5e7eb;border-radius:14px;box-shadow:0 2px 10px rgba(0,0,0,.04);padding:16px}
.muted{color:var(--muted)}
.rules{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 0}
.pill{display:inline-block;padding:6px 10px;border-radius:999px;background:#eef2ff;color:#1d4ed8;font-weight:600}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(90px,1fr));gap:10px;margin-top:12px}
a.btn{display:block;text-align:center;padding:10px 0;border:1px solid #e5e7eb;border-radius:12px;background:#fff;text-decoration:none;color:#111}
a.btn:hover{border-color:var(--brand);box-shadow:0 0 0 2px rgba(37,99,235,.15)}
footer{margin-top:24px;color:var(--muted);font-size:12px;text-align:center}

/* Guide text under rules */
.guide{margin-top:12px}
.guide p{margin:6px 0; line-height:1.6}
/* --- hocthilaixe header --- */
:root{--brand:#2a7cff;--text:#111;--muted:#6b7280;--line:#e5e7eb}
.hlx *{box-sizing:border-box}
.hlx .topbar{display:flex;align-items:center;gap:16px;padding:10px 16px;border-bottom:1px solid var(--line);background:#fff;font-family:Montserrat,system-ui,Segoe UI,Roboto,Arial,sans-serif}
.hlx .brand{font-weight:700;font-size:22px;display:flex;align-items:center;gap:6px}
.hlx .brand::before{content:"";width:14px;height:14px;background:var(--brand);border-radius:2px;display:inline-block}
.hlx .date{color:var(--muted);font-size:14px;white-space:nowrap}
.hlx .search{margin-left:auto;display:flex;align-items:center;gap:8px;background:#f3f4f6;border:1px solid #e5e7eb;padding:8px 10px;border-radius:999px;min-width:220px}
.hlx .search input{border:0;outline:0;background:transparent;width:100%}
.hlx .actions{display:flex;align-items:center;gap:14px;margin-left:6px}
.hlx .actions a{color:#111;text-decoration:none;font-weight:600}
.hlx .nav{border-bottom:1px solid var(--line);background:#fff}
.hlx .nav-inner{display:flex;align-items:center;gap:18px;padding:10px 16px}
.hlx .nav a{color:#374151;text-decoration:none;font-weight:600;padding:8px 10px;border-radius:8px}
.hlx .nav a:hover{background:#f3f4f6}
#hlx-menu-toggle{display:none}
.hlx .burger{display:none;margin-left:auto;cursor:pointer}
.hlx .burger span{display:block;width:22px;height:2px;background:#111;margin:5px 0;border-radius:2px}
@media (max-width:900px){
  .hlx .search,.hlx .actions{display:none}
  .hlx .burger{display:block}
  .hlx .links{display:none;flex-direction:column;gap:8px;padding:10px 16px;border-top:1px solid var(--line)}
  #hlx-menu-toggle:checked ~ .links{display:flex}
}
.hlx .hero{position:relative;min-height:220px;display:flex;align-items:center;background:#7b2c2c url('https://images.unsplash.com/photo-1500530855697-b586d89ba3ee?q=80&w=1920&auto=format&fit=crop') center/cover no-repeat;color:#fff;overflow:hidden}
.hlx .hero::before{content:"";position:absolute;inset:0;background:rgba(90,10,10,.45)}
.hlx .hero-content{position:relative;padding:48px 16px;max-width:1100px;margin:0 auto;width:100%}
.hlx .hero h1{margin:0;font-size:44px;font-weight:700;text-shadow:0 1px 2px rgba(0,0,0,.35)}
.hlx .hero .sub{margin-top:10px;font-size:18px;opacity:.95}
@media (max-width:600px){.hlx .hero{min-height:180px}.hlx .hero h1{font-size:30px}}
/* --- /end --- */

/* === Site footer (dễ bảo trì) === */
.site-footer{
  text-align:center;
  color:#d70000;        /* đỏ đậm */
  font-weight:700;      /* in đậm */
  background:#fff;
  padding:10px 12px;
  border-top:1px solid #eee;
  line-height:1.4;
}