/* ---------- accueil guidé et conseils */
.coach { margin:22px auto 0; max-width:560px; display:grid; gap:6px;
  padding:12px 14px; border-radius:14px; background:color-mix(in srgb, var(--surface) 94%, var(--accent));
  border:1px solid color-mix(in srgb, var(--accent) 45%, var(--line)); box-shadow:0 14px 40px rgba(0,0,0,.45);
  animation:coachIn .35s ease-out }
@keyframes coachIn { from { opacity:0; transform:translateY(12px) } }
/* secours sur téléphone : si la bulle est attachée à la page, elle flotte au-dessus de la barre d'onglets */
@media (max-width:1023px) { body > .coach { position:fixed; z-index:45; left:12px; right:12px; bottom:calc(76px + var(--safe-b)); margin:0; max-width:none } }
.coach .cstep { display:flex; align-items:center; gap:8px; font-size:12px; font-weight:700; color:var(--accent);
  text-transform:uppercase; letter-spacing:.06em }
.coach .cstep i { width:18px; height:4px; border-radius:2px; background:var(--surface2) }
.coach .cstep i.on { background:var(--accent) }
.coach .ctitle { font-weight:750; font-size:15.5px }
.coach .ctext { color:var(--muted); font-size:13.5px; line-height:1.45 }
.coach .btn { min-height:36px; padding:7px 14px; font-size:13.5px }
.coach .row { gap:8px }
.coach .skip { border:0; background:none; color:var(--muted); cursor:pointer; font-size:13px; margin-left:auto }
.coach .skip:hover { color:var(--ink) }
@keyframes pulse { 0%, 100% { box-shadow:0 0 0 0 color-mix(in srgb, var(--accent) 55%, transparent) }
  50% { box-shadow:0 0 0 8px transparent } }
.pulse { animation:pulse 1.6s ease-in-out infinite }
.tip { display:grid; gap:4px; text-align:left; margin:14px auto 0; max-width:560px; padding:12px 14px; border-radius:12px;
  background:var(--surface); border:1px solid var(--line); font-size:13.5px }
.tip b { font-size:14px }
.tip .tclose { justify-self:end; border:0; background:none; color:var(--accent); cursor:pointer; font-weight:600; font-size:13px }