/* SeatLink v3 Help (3.02.014). Colours come from tokens only. */
@layer pages {
  .help { display: grid; grid-template-columns: 16rem minmax(0, 1fr); gap: var(--s-6); align-items: start; max-width: 70rem; margin-inline: auto; }
  .help__side { position: sticky; top: var(--s-4); display: flex; flex-direction: column; gap: var(--s-4); }
  .help__toc ul { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: var(--s-1); }
  .help__toc a { display: flex; align-items: center; min-height: var(--control-h); padding: 0 var(--s-3); border-radius: var(--r-1); color: var(--ink); text-decoration: none; font-weight: 650; }
  .help__toc a:hover { background: var(--neutral-bg); }
  .help__body { display: flex; flex-direction: column; gap: var(--s-4); min-width: 0; }
  .help__section { padding: var(--s-5); background: var(--surface); border: 1px solid var(--hairline); border-radius: var(--r-2); scroll-margin-top: var(--s-4); }
  .help__section > h2 { margin: 0 0 var(--s-3); font-size: var(--text-2xl); }
  .help__section h3 { margin: var(--s-4) 0 var(--s-1); font-size: var(--text-lg); }
  .help__section p, .help__section li { max-width: 65ch; }
  .help__section ol, .help__section ul { padding-left: var(--s-5); display: flex; flex-direction: column; gap: var(--s-2); }
  .help__section code { padding: 0 var(--s-1); background: var(--surface-2); border: 1px solid var(--hairline); border-radius: var(--r-1); font-family: var(--font-mono); font-size: 0.95em; }
  .help__section details { border-top: 1px solid var(--hairline); padding: var(--s-1) 0; }
  .help__section summary { display: flex; align-items: center; min-height: var(--control-h); cursor: pointer; font-weight: 650; }
  .help__none { margin: 0; padding: var(--s-4); color: var(--ink-2); }
  @media (max-width: 52rem) {
    .help { grid-template-columns: 1fr; }
    .help__side { position: static; }
    .help__toc ul { flex-direction: row; flex-wrap: wrap; }
    .help__toc a { border: 1.5px solid var(--control-border); }
  }
}