/* The public Help page (M3; help-ui.js): the brand's theme through the page's variables, a readable column, 44 px
   targets, logical properties so Arabic reads right to left. */
.help-page { max-width: 760px; margin-inline: auto; padding-block: 24px 48px; display: flex; flex-direction: column; gap: 20px; }
.help-head h1 { margin: 0 0 6px; }
.help-head p { margin: 0; color: var(--muted-light, #b7c7bf); }
.help-search { display: flex; gap: 8px; }
.help-search input { flex: 1; min-width: 0; min-height: 44px; padding: 0 12px; border: 1px solid var(--line, #2a3c33); border-radius: var(--radius, 7px); background: var(--bg-deep, #0b1712); color: inherit; font: inherit; }
.help-search input:focus-visible, .help-list a:focus-visible, .help-back a:focus-visible { outline: 2px solid var(--focus-ring, #ffd23f); outline-offset: 2px; }
.help-results h2, .help-all h2 { margin: 0 0 8px; font-size: 1.05rem; }
.help-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.help-list a { display: flex; align-items: center; min-height: 44px; padding: 0 14px; border: 1px solid var(--line, #2a3c33); border-radius: var(--radius, 7px); background: var(--panel-alt, #14221b); color: inherit; text-decoration: none; overflow-wrap: anywhere; }
.help-list a:hover { border-color: var(--accent, #1fb26b); }
.help-note { margin: 0; color: var(--muted-light, #b7c7bf); }
.help-article h1 { margin: 0 0 12px; }
.help-article p { margin: 0 0 12px; line-height: 1.6; overflow-wrap: anywhere; }
.help-back { margin: 0; }
.help-back a { display: inline-flex; align-items: center; min-height: 44px; color: var(--odd, #ffd23f); }
.help-chat { margin: 0; }
@media (max-width: 720px) { .help-page { padding-inline: 16px; } .help-search { flex-direction: column; } }
.help-all { display: flex; flex-direction: column; gap: 20px; }
.help-category h2 { margin: 0 0 8px; font-size: 1.05rem; }