/* Le guide reprend les couleurs et le logo de l’espace de messagerie. */
.aide-page { overflow: auto; height: auto; min-height: 100dvh; font-size: 16px; }
html[data-theme="light"] .aide-page { --muted: #5e6c81; }
.aide-page .workspace-header { position: static; flex-wrap: wrap; }
.aide-page .workspace-header .brand { flex: 0 0 auto; min-width: 0; }
.aide-brand-name { font-size: 19px; font-weight: 650; letter-spacing: -.03em; }
.aide-page .workspace-header a.secondary { color: var(--accent); min-height: 44px; display: inline-flex; align-items: center; }
.aide { grid-template-columns: 250px minmax(0, 740px); gap: 64px; max-width: 1160px; padding: 48px 32px 80px; }
.aide article { min-width: 0; }
.aide-intro { margin-bottom: 48px; padding-bottom: 32px; border-bottom: 1px solid var(--line); }
.aide h1 { font-size: clamp(30px, 3.4vw, 44px); line-height: 1.15; letter-spacing: -.03em; text-wrap: balance; margin: 0 0 20px; }
.aide-intro p { font-size: 17px; color: var(--muted); }
.aide a { color: var(--accent); text-underline-offset: .22em; }
.aide section { margin-bottom: 48px; padding-top: 24px; border-top: 1px solid var(--line); scroll-margin-top: 24px; }
.aide section:first-of-type { border-top: 0; padding-top: 0; }
.aide h2 { font-size: 26px; line-height: 1.25; letter-spacing: -.025em; margin: 0 0 20px; text-wrap: balance; }
.aide h3 { font-size: 17px; line-height: 1.4; margin: 28px 0 10px; }
.aide p, .aide li, .aide dd { font-size: 16px; line-height: 1.75; }
.aide p { margin: 0 0 18px; max-width: 75ch; }
.aide code { font-size: .9em; overflow-wrap: anywhere; }
.aide-sommaire { top: 24px; max-height: calc(100dvh - 48px); overflow-y: auto; scrollbar-color: var(--line) transparent; }
.aide-sommaire summary { font-size: 16px; font-weight: 650; padding: 12px 0; cursor: pointer; }
.aide-sommaire ul { list-style: none; padding: 8px 0 0; gap: 0; }
.aide-sommaire li { font-size: 14px; }
.aide-sommaire a { display: flex; align-items: center; min-height: 44px; padding: 8px 10px; color: var(--muted); border-radius: 6px; }
.aide-sommaire a:hover, .aide-sommaire a[aria-current="location"] { background: var(--accent-soft); color: var(--accent); }
.aide-sommaire a[aria-current="location"] { font-weight: 600; }
.aide-note { padding: 20px 24px; background: var(--accent-soft); border-radius: 12px; margin: 24px 0; }
.aide-note h3 { margin-top: 0; }
.aide-note p:last-child { margin-bottom: 0; }
.aide-levels, .aide-data-flows { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; margin: 24px 0; }
.aide-levels > div, .aide-data-flows > div { border-top: 1px solid var(--line); padding-top: 16px; }
.aide-levels h3, .aide-data-flows h3 { margin-top: 0; }
.aide-levels > div:first-child h3 { color: var(--err); }
.aide-levels > div:last-child h3 { color: var(--warn); }
.aide-details { margin: 24px 0; border-block: 1px solid var(--line); }
.aide-details summary { padding: 16px 0; color: var(--accent); cursor: pointer; min-height: 44px; }
.aide-details[open] summary { margin-bottom: 8px; }
.aide-actions { margin: 24px 0; }
.aide-actions > div { padding: 20px 0; border-top: 1px solid var(--line); }
.aide-actions dt { font-size: 17px; font-weight: 650; margin-bottom: 8px; }
.aide-actions dd { margin: 0; }
.aide-back-top { display: inline-flex; align-items: center; min-height: 44px; }
.aide ::selection { background: var(--accent-soft); color: var(--ink); }
@media (max-width: 820px) {
  .aide { grid-template-columns: 1fr; padding: 24px 24px 48px; gap: 32px; }
  .aide-sommaire { position: static; max-height: none; border-block: 1px solid var(--line); }
  .aide-sommaire ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .aide-intro { margin-bottom: 32px; }
}
@media (max-width: 540px) {
  .aide-page .workspace-header { padding: 16px 24px; gap: 8px; }
  .aide-sommaire ul, .aide-levels, .aide-data-flows { grid-template-columns: 1fr; }
  .aide h2 { font-size: 24px; }
  .aide-note { padding: 18px; }
}

.aide h4 { font-size: 15px; line-height: 1.4; margin: 22px 0 8px; }
.aide-table { overflow-x: auto; margin: 10px 0 16px; }
.aide-table table { width: 100%; border-collapse: collapse; font-size: 14px; }
.aide-table th, .aide-table td { text-align: left; vertical-align: top; padding: 8px 10px; border: 1px solid var(--line); }
.aide-table thead th { background: var(--accent-soft); }
.aide-table tbody th { width: 30%; font-weight: 600; white-space: nowrap; }
.aide-table small { color: var(--muted); }
.aide-attention { max-width: none; border-left: 3px solid var(--warn); padding: 8px 12px; background: var(--accent-soft); }

.aide-schema { margin: 20px 0; }
.aide-schema img { display: block; width: 100%; height: auto; max-width: 1120px; }
/* Questions fréquentes (tâche 157) : la réponse validée garde ses retours à la ligne. */
.aide-faq-reponse { white-space: pre-line; }
