/* Shared 「使用说明」 disclosure for study, practice and review pages (built by assets/help.js).
   Directions stay one tap away beside the page title and never push the first card or question down. */

/* Static directions are folded before first paint, so the page doesn't jump when help.js runs.
   Once inside the disclosure they show again (the selectors below no longer match). */
main > .page-header > .page-desc,
[data-help]:not(.study-help > [data-help]) { display: none; }

.study-help { margin-top: 16px; color: var(--muted); font-size: .86rem; }
.study-help > summary { display: flex; align-items: center; width: fit-content; min-height: 44px; padding: 10px 4px; cursor: pointer; }
.study-help > summary:focus-visible { outline: 2px solid var(--accent-focus); outline-offset: 3px; border-radius: 4px; }
.study-help .sandy-tip, .study-help .tip { margin-top: 0; }

/* One discoverable help entry beside the title; expanded directions use the full width. */
.page-header.has-study-help { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; }
.page-header.has-study-help > .page-title { flex: 1 1 230px; min-width: 0; margin: 0; }
.page-header.has-study-help > .study-page-help { flex: 0 0 auto; margin: 0 0 0 auto; }
.study-page-help > summary { min-width: 44px; margin-left: auto; padding: 10px 8px; white-space: nowrap; }
/* Closed, the link takes one text line of layout; its 44px tap area overlaps the header's empty margins
   (practice pages hide the title on phones, so the link would otherwise push the question down). */
.page-header.has-study-help > .study-page-help:not([open]) > summary { margin-block: -10px; }
/* open: a soft-filled sheet (no border), the same tint as the +/− circle */
.page-header.has-study-help > .study-page-help[open] { flex: 1 1 100%; padding: 0 12px 12px; border: 0; border-radius: var(--radius-control, 12px); background: var(--tint-2); text-align: left; }
.study-page-help > .page-desc,
.study-page-help > [data-help] { display: block; margin: 0; color: var(--ink-2); font-size: .86rem; line-height: 1.7; }
.study-page-help > * + [data-help] { margin-top: 8px; }