.sr-only {
      position: absolute;
      width: 1px;
      height: 1px;
      padding: 0;
      margin: -1px;
      overflow: hidden;
      clip: rect(0,0,0,0);
      white-space: nowrap;
      border: 0;
    }
    .glossary-search-wrap { max-width: 780px; }
    .glossary-search-wrap .form-input {
      width: 100%;
      font-family: var(--font-body);
      font-size: 1rem;
      padding: 0.85rem 1.1rem;
      border: 1px solid var(--border);
      border-radius: var(--radius);
      background: var(--bg-surface);
      color: var(--text-primary);
      transition: border-color 0.15s, box-shadow 0.15s;
      -webkit-appearance: none;
      appearance: none;
    }
    .glossary-search-wrap .form-input:focus {
      outline: none;
      border-color: var(--accent);
      box-shadow: 0 0 0 3px rgba(30,64,175,0.15);
    }
    .glossary-search-status {
      margin-top: 0.75rem;
      font-family: var(--font-ui);
      font-size: 0.85rem;
      color: var(--text-secondary);
    }
    #glossary-no-results p { color: var(--text-secondary); }

    /* ─── Common-query chips ─── */
    .common-queries {
      max-width: 780px;
      margin: 1.25rem 0 0;
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 0.5rem;
    }
    .cq-label {
      font-family: var(--font-ui);
      font-size: 0.78rem;
      font-weight: 700;
      letter-spacing: 0.05em;
      text-transform: uppercase;
      color: var(--text-secondary);
      margin-right: 0.25rem;
    }
    .query-chip {
      font-family: var(--font-ui);
      font-size: 0.85rem;
      font-weight: 600;
      color: var(--accent);
      background: var(--bg-surface);
      border: 1px solid var(--border);
      border-radius: 999px;
      padding: 0.4rem 0.95rem;
      cursor: pointer;
      transition: background 0.15s, border-color 0.15s, color 0.15s;
      min-height: 32px;
    }
    .query-chip:hover {
      border-color: var(--accent);
      background: var(--accent-muted);
    }
    .query-chip:focus-visible {
      outline: 3px solid var(--accent);
      outline-offset: 2px;
    }

    /* ─── Collapsible letter-group headers (independent, distinct from
         the term-level .faq-item/.faq-question accordion so main.js's
         toggleFaq never touches these) ─── */
    .group-toggle {
      width: 100%;
      background: none;
      border: none;
      cursor: pointer;
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 1rem;
      margin: 0;
      padding: 0.35rem 0;
      text-align: left;
      font-family: var(--font-ui);
      font-size: clamp(1.5rem, 3.5vw, 2.25rem);
      font-weight: 700;
      line-height: 1.25;
      color: var(--text-primary);
      transition: color 0.15s;
      min-height: 44px;
    }
    .group-toggle:hover { color: var(--accent); }
    .group-toggle:focus-visible {
      outline: 3px solid var(--accent);
      outline-offset: 2px;
    }
    .group-toggle .faq-chevron { width: 28px; height: 28px; }
    .group-toggle.open .faq-chevron { transform: rotate(180deg); }
    .group-body { display: none; }
    .group-toggle.open + .group-body { display: block; }