:root { --q-help-width: clamp(380px, 29vw, 440px); }
.q-app-shell.q-help-open { grid-template-columns: var(--q-help-width) minmax(0, 1fr); }
.q-help-open > .q-app-sidebar { display: none; }
.q-help-panel { position: sticky; top: 0; height: 100dvh; min-width: 0; display: flex; flex-direction: column; background: var(--q-paper-bright); color: var(--q-ink); border-right: var(--q-border); }
.q-help-panel[hidden] { display: none; }
.q-help-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 18px 22px; border-bottom: var(--q-border); }
.q-help-header button { background: transparent; border: 0; color: inherit; padding: 8px; cursor: pointer; font: inherit; font-size: .8rem; }
.q-help-header strong { font-family: var(--q-font-serif); font-size: 1.2rem; font-weight: 400; }
.q-help-scroll { overflow-y: auto; overscroll-behavior: contain; flex: 1; padding: 24px; font-size: .82rem; line-height: 1.65; }
.q-help-scroll h2 { font-family: var(--q-font-serif); font-size: 1.8rem; font-weight: 400; line-height: 1.2; margin: 0 0 14px; }
.q-help-scroll h3 { margin: 24px 0 10px; font-family: var(--q-font-mono); text-transform: uppercase; font-size: .66rem; letter-spacing: .07em; }
.q-help-scroll p { margin: 0 0 12px; }
.q-help-scroll ol { padding-left: 22px; }
.q-help-scroll li { margin-block: 6px; }
.q-help-search { display: block; margin: 22px 0 12px; }
.q-help-search span { display: block; margin-bottom: 5px; }
.q-help-search input { width: 100%; padding: 10px; border: var(--q-border); background: white; color: var(--q-ink); font: inherit; }
.q-help-identify { width: 100%; padding: 12px; border: 1px solid var(--q-ink); background: transparent; color: var(--q-ink); font: inherit; cursor: pointer; }
.q-help-identify[aria-pressed="true"] { background: var(--q-navy); color: white; }
.q-help-status { min-height: 1.6em; color: #52665c; margin-top: 8px !important; }
.q-help-entry { border-top: var(--q-border); padding: 12px 0; scroll-margin-top: 18px; }
.q-help-entry > button { width: 100%; text-align: left; background: transparent; border: 0; padding: 5px; color: inherit; font: inherit; cursor: pointer; }
.q-help-entry strong { display: block; font-weight: 650; }
.q-help-entry .q-help-definition { display: block; margin-top: 4px; color: #53665e; }
.q-help-entry[data-selected] { box-shadow: inset 3px 0 var(--q-brass); padding-left: 10px; }
.q-help-selected { font-size: .65rem; font-family: var(--q-font-mono); text-transform: uppercase; }
.q-help-extra { padding: 10px 5px 0; }
.q-help-extra small { display: block; margin-bottom: 10px; }
.q-help-extra button { background: transparent; color: #315e4e; border: 0; padding: 8px 0; text-decoration: underline; cursor: pointer; font: inherit; }
.q-help-trigger { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; gap: 6px; padding: 7px 10px; border: 1px solid #bbc5bc; border-radius: 3px; background: transparent; color: var(--q-ink); font: inherit; font-size: .75rem; line-height: 1.4; white-space: nowrap; cursor: pointer; }
.q-help-trigger[hidden] { display: none; }
.q-help-trigger svg { flex: 0 0 auto; }
.q-help-trigger:hover { background: #ecefe6; border-color: var(--q-ink); }
.q-help-trigger[aria-expanded="true"] { background: var(--q-navy); border-color: var(--q-navy); color: white; }
.q-help-trigger:active { background: var(--q-navy); border-color: var(--q-navy); color: white; }
.q-app .q-help-trigger:focus-visible { outline: 2px solid #987329; outline-offset: 3px; }
[data-help-id] { scroll-margin-top: 90px; scroll-margin-bottom: 24px; }
[data-help-highlight] { outline: 2px dashed #bd9449 !important; outline-offset: 4px; box-shadow: 0 0 0 6px #c6a15b28 !important; }
[data-help-highlight="selected"] { outline-style: solid !important; outline-width: 3px !important; }
.q-help-identifying #q-app-page [data-help-id], .q-help-identifying #q-app-page [data-help-id] * { cursor: crosshair !important; }
@media (max-width: 1100px) {
  .q-app-shell.q-help-open { display: block; }
  .q-help-panel { position: fixed; left: 0; top: 0; width: min(var(--q-help-width), 94vw); z-index: 50; box-shadow: 6px 0 24px #102d2430; }
}
@media (prefers-reduced-motion: reduce) { .q-help-panel * { scroll-behavior: auto !important; transition: none !important; } }
