/* Guide-only spacing and persistent step navigation. */
html:has(body.guide-detail-polished) { scroll-padding-top:0; }
body.guide-detail-polished #main.guide-hub { --guide-header-height:64px; --guide-nav-height:58px; padding-bottom:52px; }
body.guide-detail-polished #main.guide-hub .beginner-head { padding:38px 0 28px; }
body.guide-detail-polished #main.guide-hub .beginner-head h1 { margin:14px auto 16px; font-size:clamp(34px,4vw,48px); line-height:1.22; text-wrap:balance; }
body.guide-detail-polished #main.guide-hub .guide-title-phrase { display:inline-block; max-width:100%; }
body.guide-detail-polished #main.guide-hub .beginner-head>p { max-width:660px; line-height:1.8; }
body.guide-detail-polished #main.guide-hub .guide-hub-actions { margin:20px 0 4px; }
body.guide-detail-polished #main.guide-hub .help-now { min-height:36px; display:inline-flex; align-items:center; margin-top:2px; }
body.guide-detail-polished #main.guide-hub .guide-before { margin-bottom:18px; padding:20px 24px; border-radius:16px; }
body.guide-detail-polished #main.guide-hub .guide-before h2 { margin-bottom:12px; }
body.guide-detail-polished #main.guide-hub .guide-before ol { gap:18px; }
body.guide-detail-polished #main.guide-hub .lesson-nav {
 position:sticky; top:var(--guide-header-height); z-index:12;
 display:flex; flex-wrap:nowrap; align-items:stretch; gap:4px; margin:0 0 22px; padding:6px;
 overflow-x:auto; overscroll-behavior-x:contain; scrollbar-width:thin;
 border:1px solid #e5e5e7; border-radius:12px; background:#f5f5f7;
 scroll-padding-inline:6px; scroll-margin-top:calc(var(--guide-header-height) + 12px);
}
body.guide-detail-polished #main.guide-hub .lesson-nav a { flex:1 0 auto; min-height:44px; padding:10px 13px; white-space:nowrap; font-size:13px; line-height:1.6; border-radius:8px; }
body.guide-detail-polished #main.guide-hub .lesson-nav a[aria-current="step"] { color:#fff; background:#0071e3; box-shadow:0 2px 5px #0071e31a; }
body.guide-detail-polished #main.guide-hub .lesson-nav a:focus-visible { outline-offset:-3px; }
body.guide-detail-polished #main.guide-hub .lesson { padding:32px; margin-bottom:22px; border-radius:20px; scroll-margin-top:calc(var(--guide-header-height) + var(--guide-nav-height) + 16px); }
body.guide-detail-polished #main.guide-hub .lesson-title h2 { margin:10px 0 12px; font-size:clamp(25px,2.8vw,32px); line-height:1.35; text-wrap:pretty; }
body.guide-detail-polished #main.guide-hub .lesson-title>p { margin-bottom:18px; line-height:1.8; }
body.guide-detail-polished #main.guide-hub .guide-visual { margin:18px 0; border-radius:16px; }
body.guide-detail-polished #main.guide-hub .guide-visual figcaption { padding:20px; }
body.guide-detail-polished #main.guide-hub .guide-visual figcaption>p { margin-top:10px; }
body.guide-detail-polished #main.guide-hub .visual-legend { gap:8px; margin-top:12px; }
body.guide-detail-polished #main.guide-hub .plain-tip { margin:16px 0; padding:16px 18px; }
body.guide-detail-polished #main.guide-hub .stop-note { margin:16px 0; padding:16px 18px; }
body.guide-detail-polished #main.guide-hub .done-note { margin-top:18px; padding:15px 18px; }
body.guide-detail-polished #main.guide-hub .plain-list li,
body.guide-detail-polished #main.guide-hub .last-check li { margin:8px 0; }
body.guide-detail-polished #main.guide-hub .lesson-step-links { margin-top:18px; padding-top:14px; gap:6px 20px; }
body.guide-detail-polished #main.guide-hub .lesson-help { padding:24px; border-radius:16px; }
body.guide-detail-polished #main.guide-hub .full-diagrams { margin-top:20px; }
@media(max-width:650px) {
 body.guide-detail-polished #main.guide-hub .beginner-head { padding:26px 0 22px; }
 body.guide-detail-polished #main.guide-hub .beginner-head h1 { max-width:11em; font-size:32px; line-height:1.26; letter-spacing:-.7px; }
 body.guide-detail-polished #main.guide-hub .beginner-head>p { font-size:14px; line-height:1.8; }
 body.guide-detail-polished #main.guide-hub .guide-hub-actions { margin-top:16px; }
 body.guide-detail-polished #main.guide-hub .guide-before { padding:18px; margin-bottom:16px; }
 body.guide-detail-polished #main.guide-hub .guide-before h2 { font-size:18px; }
 body.guide-detail-polished #main.guide-hub .guide-before ol { gap:8px; }
 body.guide-detail-polished #main.guide-hub .lesson-nav { gap:3px; margin-bottom:18px; padding:5px; border-radius:10px; }
 body.guide-detail-polished #main.guide-hub .lesson-nav a { flex:0 0 auto; padding:10px 12px; font-size:13px; }
 body.guide-detail-polished #main.guide-hub .lesson { padding:22px 18px; margin-bottom:18px; border-radius:16px; }
 body.guide-detail-polished #main.guide-hub .lesson-title h2 { font-size:25px; letter-spacing:-.5px; line-height:1.38; }
 body.guide-detail-polished #main.guide-hub .lesson-title>p { margin-bottom:16px; font-size:15px; }
 body.guide-detail-polished #main.guide-hub .guide-visual { margin:16px 0; border-radius:12px; }
 body.guide-detail-polished #main.guide-hub .guide-visual figcaption,
 body.guide-detail-polished #main.guide-hub #visual-cable figcaption { padding:16px; }
 body.guide-detail-polished #main.guide-hub .plain-tip,
 body.guide-detail-polished #main.guide-hub .stop-note,
 body.guide-detail-polished #main.guide-hub .done-note { padding:14px; }
 body.guide-detail-polished #main.guide-hub .lesson-help { padding:22px 18px; }
}
@media(max-width:360px) {
 body.guide-detail-polished #main.guide-hub .beginner-head h1 { font-size:29px; }
 body.guide-detail-polished #main.guide-hub .lesson-title h2 { font-size:24px; }
}
