/* ── Guide Kitchubb (reglages/TutorielV4.js) ──────────────── */
.guide-v4 { display: flex; flex-direction: column; gap: 12px; }
.guide-v4 > * { flex-shrink: 0; }
.guide-v4__search { display: flex; flex-direction: column; gap: 6px; font-size: 13px; font-weight: 500; color: var(--color-muted); }
.guide-v4__search input { border-radius: 999px; background-color: var(--color-surface-2); border-color: transparent; }
.guide-v4 .guide-v4__section.card { padding: 0; overflow: hidden; scroll-margin-top: 12px; }
.guide-v4__toggle { display: flex; justify-content: space-between; align-items: center; gap: 12px; width: 100%; min-height: 56px; padding: 0 16px; border: 0; background: transparent; color: var(--color-text); font: 600 17px/24px var(--font-display); letter-spacing: -.01em; text-align: left; cursor: pointer; }
.guide-v4__toggle > span:last-child { color: var(--color-primary); font-family: var(--font-body); font-size: 20px; }
.guide-v4__content { display: flex; flex-direction: column; gap: 10px; padding: 0 16px 16px; line-height: 1.45; }
.guide-v4__content > p { color: var(--color-muted); }
.guide-v4__content ol { margin: 0; padding-left: 22px; }
.guide-v4__content h3 { margin: 8px 0 0; font-size: 15px; }
.guide-v4__content li { padding: 0 0 12px 4px; }
.guide-v4__content li strong { display: block; color: var(--color-text); font-weight: 600; }
.guide-v4__content li span { display: block; font-size: 13px; line-height: 18px; color: var(--color-muted); }
.guide-v4__content .btn { width: 100%; }
.guide-v4__limits { display: flex; flex-direction: column; gap: 8px; }
.guide-v4__limits h2 { font: 600 17px/24px var(--font-display); }
.guide-v4__limits ul { margin: 0; padding-left: 20px; font-size: 13px; line-height: 18px; color: var(--color-muted); display: flex; flex-direction: column; gap: 8px; }

/* ── Carte de tutoriel (lot 19, décision 6) : en bas de l'écran, bouton concerné entouré ── */
.tuto-carte {
  position: fixed; z-index: 450; left: var(--gutter); right: var(--gutter); bottom: calc(16px + var(--safe-bottom));
  display: flex; flex-direction: column; gap: 8px;
  max-width: 430px; margin-inline: auto; padding: 18px;
  background: var(--color-surface); color: var(--color-text);
  border: 0; border-radius: var(--radius-card);
  box-shadow: var(--shadow-float);
  animation: tuto-entree .2s ease;
}
.tuto-carte--haut { bottom: auto; top: calc(68px + var(--safe-top)); }
@keyframes tuto-entree { from { opacity: 0; transform: translateY(12px); } }
.tuto-carte:focus { outline: none; }
.tuto-carte:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 3px; }
.tuto-carte__haut { display: flex; gap: 6px; margin: 0; font: 600 11px/14px var(--font-body); letter-spacing: .06em; text-transform: uppercase; color: var(--color-primary); }
.tuto-carte__tour::after { content: "·"; margin-left: 6px; }
.tuto-carte__pos { white-space: nowrap; font-variant-numeric: tabular-nums; }
.tuto-carte__titre { margin: 0; font: 600 20px/26px var(--font-display); letter-spacing: -.015em; color: var(--color-text); }
.tuto-carte__texte { margin: 0 0 6px; font-size: 15px; line-height: 21px; color: var(--color-muted); }
.tuto-carte__actions { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.tuto-carte__actions .btn { min-height: 44px; }
.tuto-carte__actions .btn--primary { margin-left: auto; min-height: 44px; padding-inline: 22px; font-size: 15px; }
.tuto-carte__passer { color: var(--color-muted); padding-inline: 0; }

.tuto-cible {
  outline: 3px solid var(--color-raspberry) !important; outline-offset: 3px;
  box-shadow: 0 0 0 7px var(--color-raspberry-soft) !important;
  scroll-margin-top: 96px; scroll-margin-bottom: 220px;
  animation: tuto-cible 1.6s ease-in-out infinite;
}
@keyframes tuto-cible { 50% { outline-offset: 6px; } }
@media (prefers-reduced-motion: reduce) {
  .tuto-carte, .tuto-cible { animation: none; }
}

/* Guide : « Faire le tour de l'app » et « Revoir le tutoriel » (lot 20, décisions 9 et 10). */
.guide-v4__tour { width: 100%; }
.guide-v4__revoir { display: grid; gap: 4px; }

/* Réglages : interrupteur « Ne plus montrer les tutoriels » (décision 12) ; interrupteur du socle. */
.reglage-interrupteur { display: flex; align-items: center; justify-content: space-between; gap: 14px; cursor: pointer; }
.reglage-interrupteur__titre { display: block; }
.reglage-interrupteur__aide { display: block; }