/* Trang hướng dẫn sử dụng (/huong-dan/, phím F1). */
.hd-tim { width: 300px; }
.hd-khung { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 16px; align-items: start; }
.hd-muc-luc { position: sticky; top: 66px; max-height: calc(100vh - 80px); overflow-y: auto; padding: 12px 8px; }
.hd-muc-luc-ten { font-size: 11.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--mo); padding: 0 10px 6px; }
.hd-muc-luc ol { list-style: none; margin: 0; padding: 0; }
.hd-muc-luc a { display: block; padding: 5px 10px; border-radius: 7px; color: var(--muc); font-size: 13px; line-height: 1.35; }
.hd-muc-luc a:hover { background: var(--giay-2); text-decoration: none; }
.hd-muc-luc a.dang-xem { background: var(--chinh-nhat); color: var(--chinh-dam); font-weight: 600; box-shadow: inset 3px 0 0 var(--chinh); }

.hd-phan { scroll-margin-top: 66px; line-height: 1.6; max-width: 980px; }
.hd-phan > h2 { font-size: 17px; margin-bottom: 10px; }
.hd-phan h3 { margin: 16px 0 6px; color: var(--chinh-dam); }
.hd-phan h2 + h3 { margin-top: 4px; }
.hd-phan ul, .hd-phan ol { margin: 0 0 8px; padding-left: 22px; }
.hd-phan li { margin: 3px 0; }
.hd-phan li > ul { margin: 3px 0 0; }
.hd-phan p { margin: 0 0 8px; }
.hd-phan code { font: 12.5px/1.4 ui-monospace, Consolas, monospace; background: var(--giay-2); border: 1px solid var(--vien); border-radius: 4px; padding: 0 4px; }
.hd-phan:target { border-color: var(--chinh); box-shadow: 0 0 0 3px var(--chinh-nhat); }
.hd-khong-thay { padding: 30px; text-align: center; color: var(--mo); }

@media (max-width: 900px) {
  .hd-khung { grid-template-columns: minmax(0, 1fr); }
  .hd-muc-luc { position: static; max-height: none; }
  .hd-tim { width: 100%; }
}
@media print {
  .hd-muc-luc, .hd-tim { display: none !important; }
  .hd-khung { display: block; }
  .hd-phan { break-inside: avoid-page; max-width: none; }
  .hd-phan.an { display: block !important; }
}
