/* Segmented reading-level control for the "Ask the Hub" answer. Exhibit A8 of the
   Website Services Agreement makes the audience modes purchased scope, so the
   control ships as an ordinary part of the Ask surface. One deliberate decision: the pill styling wraps a REAL native radio
   input rather than a div-based fake control, so arrow-key navigation and the
   theme's existing input:focus-visible ring work with zero extra ARIA wiring; the
   .is-checked class (toggled by assets/ask.js on change) only adds the filled-pill
   look on top of that native behavior, it never replaces it. */
.ask-mode-bar{margin:0 0 1.1rem}
.ask-mode{display:flex;flex-wrap:wrap;align-items:center;gap:.55rem}
.ask-mode-label{font-family:var(--display);font-weight:700;font-size:.82rem;
  color:var(--harbor);margin-right:.15rem}
.ask-mode-opt{display:inline-flex;align-items:center;gap:.45rem;min-height:24px;
  border:2px solid var(--line);background:#fff;border-radius:999px;
  padding:.42rem .95rem;cursor:pointer;font-size:.88rem;font-weight:600;
  color:var(--harbor);transition:border-color .15s,background-color .15s,color .15s}
.ask-mode-opt input{accent-color:var(--copper-deep);width:1rem;height:1rem;
  margin:0;flex:none}
.ask-mode-opt:hover{border-color:var(--bay)}
.ask-mode-opt.is-checked{background:var(--harbor);border-color:var(--harbor);color:#fff}
.ask-mode-opt.is-checked input{accent-color:var(--spark)}
#lib-answer .ask-mode-bar{margin-top:.2rem}