/* Trang chủ mục lục docs.ghephang.com — sáng/tối theo hệ điều hành, rộng tối thiểu 360px. */
:root {
  --nen: #f7f8fa;
  --the: #ffffff;
  --chu: #1c2430;
  --phu: #5d6878;
  --vien: #e2e6ec;
  --nhan: #0b6bcb;
}
@media (prefers-color-scheme: dark) {
  :root {
    --nen: #111418;
    --the: #1a1f26;
    --chu: #e6e9ee;
    --phu: #9aa4b2;
    --vien: #2a313b;
    --nhan: #5aa9ff;
  }
}
* { box-sizing: border-box; }
body {
  margin: 0;
  background: var(--nen);
  color: var(--chu);
  font: 15px/1.5 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}
.khung { max-width: 820px; margin: 0 auto; padding: 24px 16px 48px; }
.dau-trang { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: space-between; margin-bottom: 16px; }
h1 { font-size: 22px; margin: 0; }
#o-tim {
  flex: 1 1 240px; max-width: 320px; height: 40px; padding: 0 12px;
  border: 1px solid var(--vien); border-radius: 8px; background: var(--the); color: var(--chu); font-size: 15px;
}
#o-tim:focus { outline: 2px solid var(--nhan); outline-offset: -1px; }
.trang-thai { color: var(--phu); }
.nhom { background: var(--the); border: 1px solid var(--vien); border-radius: 10px; margin-bottom: 16px; overflow: hidden; }
.nhom h2 { font-size: 13px; text-transform: uppercase; letter-spacing: .04em; color: var(--phu); margin: 0; padding: 12px 16px 8px; }
.nhom ul { list-style: none; margin: 0; padding: 0; }
.nhom li { display: flex; gap: 12px; justify-content: space-between; align-items: baseline; padding: 10px 16px; border-top: 1px solid var(--vien); }
.nhom a { color: var(--nhan); text-decoration: none; overflow-wrap: anywhere; }
.nhom a:hover { text-decoration: underline; }
.ngay { color: var(--phu); font-size: 13px; white-space: nowrap; font-variant-numeric: tabular-nums; }