/* Guide-only additions reuse Haven's typography, colors and page widths. */
.hv-tutorial-start,.hv-tutorial-result { margin: 2rem 0; }
.hv-tutorial-nav { display:flex; flex-wrap:wrap; gap:.6rem 1.25rem; margin:1.5rem 0; }
.hv-tutorial-nav a { font-size:.92rem; }
.hv-tutorial-screen { margin:2rem 0; }
.hv-tutorial-screen img { display:block; width:100%; height:auto; border:1px solid var(--border,#ddd); border-radius:12px; }
.hv-tutorial-screen figcaption { margin:.75rem 0; font-size:.85rem; line-height:1.6; }
.hv-tutorial-steps { list-style:none; padding:0; margin:2rem 0; }
.hv-tutorial-steps li { display:grid; grid-template-columns:2.5rem minmax(0,1fr); gap:1rem; margin:2rem 0; scroll-margin-top:7rem; }
.hv-tutorial-number { display:grid; place-items:center; align-self:start; width:2.5rem; height:2.5rem; border-radius:50%; background:#15132e; color:#fff; font-weight:700; }
.hv-tutorial-steps h2 { margin:0 0 .6rem; }
.hv-tutorial-steps p { margin:0; }
@media (max-width:600px) { .hv-tutorial-steps li { gap:.75rem; } .hv-tutorial-nav { flex-direction:column; } }