/* Maison Kôssi (marque fictive) — styles propres à : aide. Chargée après styles.css, qui déclare l’ordre des couches. */
@layer pages {
  /* ---------- Aide ---------- */
  .help-nav { position: sticky; inset-block-start: var(--header-h); z-index: 20; background: var(--color-creme); border-block-end: 1px solid var(--color-ligne-deco); } .help-nav .toc { padding-block: var(--s-2); flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; } .help-nav .toc a { white-space: nowrap; padding-inline: 0.5rem; }
  .help-sec { padding-block: var(--s-7); border-block-end: 1px solid var(--color-ligne-deco); scroll-margin-block-start: calc(var(--header-h) + 3.5rem); } .help-sec:last-of-type { border-block-end: 0; }
  .calc__out { padding: var(--s-4); border-radius: var(--radius); background: var(--color-or-pale); font-weight: 600; min-block-size: 3.5rem; }
  .seg { display: inline-flex; padding: 0.2rem; border-radius: 999px; background: var(--color-sable); gap: 0.15rem; } .seg button { min-block-size: 2.5rem; padding-inline: 1rem; border-radius: 999px; font-weight: 700; font-size: 0.9375rem; } .seg button[aria-pressed="true"] { background: var(--color-indigo); color: var(--color-creme); }
  .track-result { display: grid; gap: var(--s-4); padding: var(--s-5); border-radius: var(--radius-lg); background: var(--color-papier); border: 1px solid var(--color-ligne-deco); }
  .order-list { display: grid; gap: var(--s-2); list-style: none; padding: 0; } .order-list li { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--s-2) var(--s-4); padding: var(--s-3) var(--s-4); border-radius: var(--radius); background: var(--color-creme); }
}