/* v467 — page-purpose help and a non-overlapping question-mark control. */
.context-help-toggle {
  position: relative;
  isolation: isolate;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  direction: rtl;
  gap: 8px;
  overflow: visible;
}
.context-help-toggle > * {
  position: relative !important;
  inset: auto !important;
  transform: none !important;
  grid-column: auto !important;
}
.context-help-mark {
  z-index: 4 !important;
  order: 0;
  flex: 0 0 24px;
  inline-size: 24px !important;
  block-size: 24px !important;
  min-inline-size: 24px;
  margin: 0 !important;
  overflow: visible !important;
  pointer-events: none;
  text-indent: 0;
}
.context-help-label {
  z-index: 2 !important;
  order: 1;
  flex: 0 1 auto;
  min-inline-size: 0;
}
.context-help-state {
  z-index: 2 !important;
  order: 2;
  flex: 0 0 auto;
}
.context-help-panel {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 12px;
}
.context-help-copy {
  inline-size: min(100%, 66ch);
  max-inline-size: 66ch;
  margin-inline: auto;
}
.context-help-panel .context-help-copy p {
  display: block;
  flex: none;
  max-inline-size: none;
  margin: 0;
  text-align: start;
}
.context-help-kicker {
  color: var(--color-info);
  font-size: var(--fs-xs);
  font-weight: 850;
  letter-spacing: .01em;
}
.context-help-heading {
  margin-block-start: 3px !important;
  color: var(--color-foreground);
  font-weight: 850;
}
.context-help-summary,
.context-help-detail {
  margin-block-start: 8px !important;
  color: var(--color-muted-foreground);
  line-height: 2;
  text-wrap: pretty;
}
.context-help-guide {
  align-self: start;
  margin-inline: auto;
}
@media (max-width: 560px) {
  .context-help-toggle { gap: 6px; padding-inline: 10px; }
  .context-help-mark {
    flex-basis: 23px;
    inline-size: 23px !important;
    block-size: 23px !important;
    min-inline-size: 23px;
  }
  .context-help-copy { inline-size: 100%; max-inline-size: none; }
  .context-help-summary, .context-help-detail { line-height: 1.9; }
}


/* v481: keep the explicit current-page guide label readable on phones and desktop. */
.context-help-toggle { max-inline-size: min(92vw, 420px); min-inline-size: 0; white-space: normal; }
.context-help-state { max-inline-size: 100%; white-space: normal; text-align: center; line-height: 1.35; text-wrap: balance; }
@media (max-width: 560px) {
  .context-help-toggle { max-inline-size: calc(100vw - 24px); }
  .context-help-state { max-inline-size: 18rem; }
}


/* v482: requested text-only help affordance; keep the real button and keyboard access. */
.context-help {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
}
.context-help-toggle {
  display: inline-block !important;
  appearance: none !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  min-inline-size: 0 !important;
  min-block-size: 0 !important;
  max-inline-size: min(100%, 420px) !important;
  color: inherit !important;
  font: inherit !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
  text-align: start !important;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: .18em;
  cursor: pointer;
}
.context-help-toggle:hover {
  background: transparent !important;
  text-decoration-thickness: 2px;
}
.context-help-toggle:focus-visible {
  outline: none !important;
  background: transparent !important;
  text-decoration-thickness: 3px;
  text-underline-offset: .2em;
}
.context-help-toggle > * {
  flex: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
.context-help-state {
  display: inline !important;
  max-inline-size: 100% !important;
  white-space: normal !important;
  text-align: start !important;
  line-height: inherit !important;
}
