/* faq.css. Page-specific styles for the FAQ page.
   Collapsible <details> rows, section nav, and a search input.
   The intro note uses an accent-rail callout treatment shared with
   other informational notices. */

.prose-page .faq-section{margin-bottom:2.5rem;}
.prose-page .faq-section-label{font-family:var(--font-mono);font-size:var(--fs-label-xs);font-weight:var(--fw-label);text-transform:uppercase;letter-spacing:var(--ls-label-wide);line-height:var(--lh-label);color:var(--color-text-tertiary);padding-bottom:0.55rem;border-bottom:1px solid var(--color-border);margin-bottom:0.25rem;}
.prose-page details{border-bottom:1px solid var(--color-border);}
.prose-page details summary{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 0;font-size:var(--fs-prose-sm);font-weight:var(--fw-label);color:var(--color-text);cursor:pointer;list-style:none;user-select:none;transition:color var(--duration-fast);}
.prose-page details summary::-webkit-details-marker{display:none;}
.prose-page details summary::marker{display:none;}
.prose-page details summary:hover{color:var(--color-accent);}
.prose-page details[open] summary{color:var(--color-accent);}
.prose-page .summary-chevron{flex-shrink:0;width:15px;height:15px;color:var(--color-text-tertiary);transition:transform var(--duration-fast);}
.prose-page details[open] .summary-chevron{transform:rotate(180deg);color:var(--color-accent);}
.prose-page .faq-answer{padding:0 0 1.25rem;font-size:var(--fs-prose-sm);line-height:1.75;color:var(--color-text-secondary);}
.prose-page .faq-answer p + p{margin-top:0.65rem;}
.prose-page .faq-answer code{font-family:var(--font-mono);font-size:0.85em;background:var(--color-bg-alt);border-radius:var(--radius-sm);padding:0.1em 0.35em;color:var(--color-text);}

/* Section nav: mono small-caps anchors, hairline rule below. */
.prose-page .faq-nav{display:flex;flex-wrap:wrap;gap:0.5rem 1.4rem;margin:0 0 1.5rem;padding-bottom:1rem;border-bottom:1px solid var(--color-border);font-family:var(--font-mono);font-size:var(--fs-label-sm);text-transform:uppercase;letter-spacing:var(--ls-label-wide);line-height:var(--lh-label);}
.prose-page .faq-nav-link{color:var(--color-text-tertiary);text-decoration:none;transition:color var(--duration-fast);}
.prose-page .faq-nav-link:hover{color:var(--color-accent);}

/* Intro note uses the accent-rail treatment shared with other
   informational callouts. */
.prose-page .faq-dev-note{display:flex;align-items:flex-start;gap:0.75rem;padding:0.65rem 0 0.65rem 14px;border-left:2px solid var(--color-accent);margin-bottom:1.5rem;font-size:var(--fs-prose-sm);line-height:1.6;color:var(--color-text-secondary);}
.prose-page .faq-dev-note strong{color:var(--color-text);font-family:var(--font-display);}
.prose-page .faq-dev-note a{font-weight:var(--fw-label-strong);}
.prose-page .faq-dev-note-body{flex:1;}
.prose-page .faq-dev-note-dismiss{flex-shrink:0;background:none;border:none;cursor:pointer;padding:0.1rem;color:var(--color-text-tertiary);line-height:0;transition:color 0.15s;margin-top:0.1rem;}
.prose-page .faq-dev-note-dismiss:hover{color:var(--color-text);}
.prose-page .faq-dev-note-dismiss svg{width:14px;height:14px;display:block;}

/* Search: shared app-style input with a leading icon. */
.prose-page .faq-search-wrap{margin:0 0 2rem;position:relative;}
.prose-page .faq-search{padding-left:2rem;}
.prose-page .faq-search-icon{position:absolute;left:0.65rem;top:50%;transform:translateY(-50%);width:15px;height:15px;color:var(--color-text-tertiary);pointer-events:none;}
.prose-page .faq-no-results{text-align:left;color:var(--color-text-tertiary);font-family:var(--font-ui);font-size:var(--fs-ui-sm);line-height:var(--lh-ui);padding:1.25rem 1.35rem;display:none;background:var(--empty-surface);border:1px solid var(--empty-edge);border-left:2px solid var(--instrument-rail-muted);border-radius:var(--radius-sm);box-shadow:var(--chrome-inset);}