/* Trang hướng dẫn sử dụng (public/huong-dan.html): dùng chung màu, chữ với app (style.css) */
.guide { max-width: 760px; margin: 0 auto; padding: 20px 16px 48px; }
.guide-head { margin-bottom: 16px; }
.guide-back { display: inline-block; margin-bottom: 12px; font-weight: 600; text-decoration: none; }
.guide-brand { display: flex; align-items: center; gap: 10px; font-weight: 700; margin-bottom: 10px; }
.guide-roles { font-size: 14px; }
.guide-role { display: inline-block; background: var(--brand-soft); color: var(--brand); border-radius: 999px; padding: 1px 10px; font-weight: 600; font-size: 13px; }
.guide-toc ol { margin: 0 0 8px; padding-left: 22px; }
.guide-toc li { margin: 3px 0; }
.guide-part { font-weight: 700; margin: 10px 0 4px; }
.guide-part-title { margin: 28px 0 12px; font-size: 19px; }
.guide-sec { scroll-margin-top: 12px; }
.guide-sec h2 { display: flex; align-items: center; gap: 10px; }
.guide-sec h3 { margin-top: 14px; }
.guide-num { flex: none; display: inline-grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--brand); color: var(--brand-ink); font-size: 14px; }
.guide-steps { margin: 0 0 10px; padding-left: 22px; }
.guide-steps > li { margin: 6px 0; padding-left: 2px; }
.guide-steps ul, .guide-list { margin: 6px 0; padding-left: 20px; }
.guide-list li { margin: 8px 0; }
.guide-tip { background: var(--warn-soft); border-radius: 8px; padding: 8px 12px; font-size: 14px; }
.guide-faq dt { font-weight: 700; margin-top: 14px; }
.guide-faq dd { margin: 4px 0 0; }
.guide-foot { text-align: center; margin-top: 24px; }
.guide-foot .btn { text-decoration: none; display: inline-block; }
@media (max-width: 520px) {
  .guide { padding: 14px 12px 40px; }
  .card.guide-sec, .card.guide-toc { padding: 14px; }
}