.guide-hero{padding:4rem 0 3rem}.guide-hero h1{margin:0;font-size:clamp(2.8rem,7vw,5.5rem);line-height:1.05;letter-spacing:-.06em}.guide-layout{display:grid;grid-template-columns:12rem minmax(0,1fr);gap:clamp(1.5rem,4vw,4rem);padding-bottom:3rem}.guide-sidebar{position:relative}.guide-nav{position:sticky;top:2rem;padding-left:1.1rem}.guide-nav-title{margin:0 0 1.5rem;color:var(--muted);font-size:.75rem}.guide-nav-title span{margin-left:.5rem;color:var(--teal)}.guide-rail{position:absolute;top:3rem;bottom:1.3rem;left:0;width:3px;background:rgba(255,255,255,.12);border-radius:999px;overflow:hidden}.guide-rail i{display:block;width:100%;height:0;background:linear-gradient(var(--blue),var(--teal));border-radius:inherit}.guide-nav ol{display:grid;gap:.7rem;margin:0;padding:0;list-style:none}.guide-nav a{display:flex;align-items:center;gap:.65rem;padding:.8rem .5rem;color:var(--muted);font-size:.8rem;text-decoration:none;border-radius:.6rem}.guide-nav a span{color:var(--muted);font: .75rem ui-monospace,monospace}.guide-nav a b{font-weight:500}.guide-nav a[aria-current=step]{background:rgba(81,201,178,.09);color:var(--teal)}.guide-nav a[aria-current=step] span{color:var(--teal)}.guide-nav a.is-read span{color:var(--blue)}.guide-step{padding:1.5rem 0 2.5rem;border-top:1px solid var(--line);scroll-margin-top:2rem}.step-index{margin:0 0 .6rem!important;color:var(--blue)!important;font:700 .7rem ui-monospace,monospace;letter-spacing:.14em}.guide-step h2{margin:0 0 1.5rem;font-size:clamp(1.4rem,3vw,2rem);letter-spacing:-.04em}.guide-step h3{margin:1.8rem 0 .65rem;font-size:1.1rem}.guide-step p,.guide-step blockquote{color:var(--muted);font-size:.95rem;line-height:1.9;overflow-wrap:anywhere}.guide-step strong{color:var(--text)}.guide-step a:not(.primary):not(.secondary){color:var(--blue);text-underline-offset:.2em}.guide-step code{padding:.12rem .35rem;border:1px solid var(--line);border-radius:.3rem;color:var(--text);background:rgba(255,255,255,.05);font-size:.85em}.guide-actions{display:flex;flex-wrap:wrap;gap:.7rem;margin:1.3rem 0 1.6rem}.guide-actions .primary{background:linear-gradient(100deg,#7c3aed,#0891b2);border-color:transparent}.guide-warning{margin-top:1.5rem;padding:1.1rem 1.2rem;border:1px solid rgba(251,113,133,.3);border-left:3px solid var(--coral);border-radius:.6rem;background:rgba(251,113,133,.07)}.guide-warning strong{color:#ffbbc6}.guide-warning p{margin:.4rem 0 0;color:#edc3cb}.guide-step blockquote{margin:1.2rem 0;padding:1rem 1.2rem;border-left:2px solid var(--purple);border-radius:0 .7rem .7rem 0;background:rgba(167,139,250,.07)}.guide-step figure{margin:1.5rem 0 2rem}.guide-step figure a{display:block;border:1px solid var(--line);border-radius:.85rem;overflow:hidden;background:#11142a}.guide-step img{display:block;width:100%;height:auto}.guide-step figcaption{margin:.65rem 0 0;color:var(--muted);text-align:center;font-size:.75rem}
.guide-step figure.guide-portrait a{width:fit-content;max-width:100%;margin-inline:auto}.guide-step figure.guide-portrait img{width:auto;height:auto;max-width:100%;max-height:min(48rem,90svh)}
@media(max-width:760px){.guide-hero{padding:3rem 0 2.5rem}.guide-layout{grid-template-columns:2.7rem minmax(0,1fr);gap:1rem}.guide-nav{padding-left:.45rem;top:1rem}.guide-nav-title{font-size:0;margin:0 0 1rem}.guide-nav-title span{display:block;margin:0;font-size:.65rem}.guide-rail{top:2.4rem;bottom:1rem}.guide-nav a{padding:.85rem .3rem}.guide-nav a b{display:none}.guide-step p,.guide-step blockquote{font-size:.88rem}.guide-warning{padding:.85rem}.guide-step h2{font-size:1.35rem}.guide-step h3{font-size:1rem}.guide-step figure{margin-inline:0}.guide-actions{align-items:stretch;flex-direction:column}.guide-actions a{justify-content:center}}
