/* ACLS site additions on top of the shared style.css: role picker and level folds. */
.role-pick { display: inline-flex; align-items: center; gap: 8px; margin-right: 6px; font-size: 14px; color: var(--ink-2); }
.role-pick select { min-height: 36px; max-width: 46vw; padding: 4px 8px; border: 1px solid var(--line-strong); border-radius: 6px; background: var(--surface); color: var(--ink); font: inherit; font-size: 14px; }
.role-lead { margin: -8px 0 16px; padding: 8px 12px; max-width: 760px; font-size: 14px; color: var(--ink-2); background: var(--surface); border: 1px solid var(--line); border-left: 3px solid var(--accent); border-radius: 6px; }
.visually-hidden { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.lvl-badge { display: inline-block; margin-left: 6px; padding: 0 6px; border-radius: 4px; font-size: 12px; font-weight: 600; color: var(--ink-2); border: 1px solid var(--line-strong); vertical-align: 1px; }
details.is-deeper > summary .lvl-badge { color: var(--warn-ink); background: var(--warn-bg); border-color: var(--warn-line); }
@media (max-width: 560px) {
  .role-pick-label { display: none; }
  .badge-trial { display: none; }
}