/* Guide chapter reader (single-sb_guide.php). From design/resources/clean/guide.css, scoped to .rs.
   Dropped: the booking mock-up, copy-link box, quiz and chapter-resource rules (no data for them). */
.rs .gbar{position:sticky;top:68px;z-index:20;background:#fff;border-bottom:1px solid var(--line)}
.rs .gbar-in{display:flex;align-items:center;gap:16px;height:60px}
.rs .gbar b{font:750 16px var(--fd);letter-spacing:-.015em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rs .gbar .bar{flex:1;max-width:280px;margin-left:auto}
.rs .gbar .meta{white-space:nowrap}
.rs .cnav{position:sticky;top:148px;display:grid;gap:6px}
.rs .cnav .ring{display:flex;gap:14px;align-items:center;padding:14px;border-radius:20px;background:color-mix(in srgb,var(--c-inb) 11%,#fff);margin-bottom:8px}
.rs .cnav svg.pr{width:56px;height:56px;flex:none}
.rs .cnav .ring b{display:block;font:750 16px var(--fd)}
.rs .cnav ol{list-style:none;padding:0;display:grid;gap:4px}
.rs .cnav a{display:grid;grid-template-columns:30px minmax(0,1fr);gap:10px;align-items:center;padding:8px 10px;border-radius:12px;text-decoration:none;color:var(--ink-2);font-size:14.5px;font-weight:600;line-height:1.3}
.rs .cnav a:hover{background:var(--bg-alt);color:var(--ink)}
.rs .cnav .n{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--bg-alt);font:800 13px var(--fd);color:var(--ink)}
.rs .cnav .done .n{background:var(--c-mon);color:#fff;--ic-ink:#fff}
.rs .cnav .n .sbi{width:15px;height:15px}
.rs .cnav .cur a{background:var(--ink);color:#fff}
.rs .cnav .cur .n{background:#fff;color:var(--ink)}
.rs .chh{display:grid;gap:12px;margin-bottom:28px}
.rs .chh h1{font-size:clamp(2.2rem,4vw,3.4rem)}
.rs .obj{border-radius:22px;background:var(--bg-alt);padding:22px 24px;display:grid;gap:10px}
.rs .obj b{font:750 17px var(--fd);color:var(--ink)}
.rs .obj ul{list-style:none;padding:0!important;display:grid;gap:8px}
.rs .obj li{display:flex;gap:10px;color:var(--ink);font-size:16.5px}
.rs .obj li .sbi{width:20px;height:20px;--ic-ink:var(--c-inb);--ic-accent:var(--c-inb);margin-top:3px}
.rs .done-b{display:flex;gap:16px;align-items:center;justify-content:space-between;padding:22px;border-radius:22px;background:var(--royal-soft);flex-wrap:wrap}
.rs .done-b b{font:750 19px var(--fd);color:var(--ink)}
.rs .done-b .btn.is{background:var(--c-mon)}
.rs .pn{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}
.rs .pn a{display:grid;gap:4px;padding:18px 20px;border-radius:20px;border:1px solid var(--line);text-decoration:none;color:var(--ink)}
.rs .pn a:hover{border-color:var(--ink);color:var(--ink)}
.rs .pn a:last-child{text-align:right}
.rs .pn small{font-size:13px;color:var(--muted);font-weight:700}
.rs .pn b{font:750 17px var(--fd)}
@media (max-width:900px){
.rs .cnav{position:static}
.rs .gbar .bar{display:none}
.rs .pn{grid-template-columns:minmax(0,1fr)}
.rs .pn a:last-child{text-align:left}}
/* Additions for real content */
.rs .gbar{top:71px}
.rs .cnav{top:151px}
.rs .cnav .ring{background:color-mix(in srgb,var(--k,var(--c-inb)) 11%,#fff)}
.rs .cnav .ring circle[data-g-ring]{transition:stroke-dashoffset .6s}
.rs .cnav .cur a{background:var(--ink);color:#fff}
.rs .crumbs{margin-bottom:24px}
.rs .bds{display:flex;gap:8px;flex-wrap:wrap}
.rs .chh .lede{margin:0}
.rs .gart{min-width:0;display:grid;gap:48px}
.rs .gch{display:block;scroll-margin-top:150px}
.rs .gch>.bds{margin-bottom:12px}
.rs .gch h2.gch-h{font-size:clamp(1.8rem,3vw,2.5rem);margin-top:0}
.rs .gch .pn{margin-top:32px}
.rs .gch .done-b{margin-top:32px}
.rs .pn a{text-decoration:none}
.rs .pn>span:empty{display:block}
.rs .gimg{margin:0;border-radius:20px;overflow:hidden;border:1px solid var(--line)}
.rs .gimg img{display:block;width:100%;height:auto}
.rs .alay.solo{grid-template-columns:minmax(0,1fr)}
.rs .alay.solo .gart{margin:0 auto}
.rs.js-one .gch:not(.on){display:none}
.rs .gcard{border:1px solid var(--line);border-radius:24px;overflow:hidden;display:flex;flex-direction:column;text-decoration:none;color:var(--ink);background:#fff;transition:transform .45s var(--ease),border-color .2s}
.rs .gcard:hover{transform:translateY(-4px);border-color:var(--ink);color:var(--ink)}
.rs .gcard .art{border-radius:0;aspect-ratio:16/9}
.rs .gcard .bdy{padding:18px 20px 20px;display:grid;gap:10px;flex:1;align-content:start}
.rs .gcard h3{font-size:19px}
.rs .gcard .mt{display:flex;gap:12px;font-size:13px;color:var(--muted);font-weight:600;flex-wrap:wrap}
.rs .gcard .mt span{display:inline-flex;gap:5px;align-items:center;--ic-ink:var(--muted)}
.rs .gcard .mt .sbi{width:15px;height:15px}
.rs .gprog{display:grid;gap:6px}
.rs .gcard .bar{height:6px}
@media (max-width:900px){.rs .cnav .ring{margin-bottom:0}.rs .cnav ol{display:flex;gap:6px;overflow-x:auto;padding-bottom:4px;scrollbar-width:none}.rs .cnav ol li{flex:none}.rs .cnav a{grid-template-columns:30px auto;white-space:nowrap}}
@media (prefers-reduced-motion:reduce){.rs .cnav .ring circle[data-g-ring]{transition:none}}
.rs .cnav .cur.done .n{background:var(--c-mon);color:#fff;--ic-ink:#fff}
@media (max-width:900px){.rs .cnav,.rs .cnav ol{min-width:0;max-width:100%}.rs .glay>*,.rs .gl>*{min-width:0}}
/* The guide introduction (main editor), above chapter 1 */
.rs .gch .gintro{padding-bottom:28px;margin-bottom:28px;border-bottom:1px solid var(--line)}
.rs .gch .gintro>*+*{margin-top:16px}
.rs .gch .gintro+.bds{margin-top:0}
/* Hero: the guide art as a tinted panel behind the title (like the /guides/ "Start here" card) */
.rs .gh{position:relative;border-radius:28px;overflow:hidden;min-height:340px;padding:32px;display:flex;align-items:flex-start}
.rs .gh>.art.ga{position:absolute;inset:0;aspect-ratio:auto;border-radius:0}
.rs .gh>.art.ga img{right:5%;height:90%}
.rs .gh>.art.ga::before{width:46%;right:-4%;bottom:-34%}
.rs .gh>.art.ga .ga-chip{left:auto;right:20px;top:20px}
.rs .gh-t{position:relative;z-index:2;display:grid;gap:12px;max-width:64%}
.rs .gh h1{font-size:clamp(2rem,3.4vw,2.9rem)}
.rs .gh .lede{color:var(--ink-2)}
.rs .chh .g-by{margin-top:6px}
@media (max-width:620px){
.rs .gh{padding:22px 20px 196px;min-height:0;border-radius:22px}
.rs .gh-t{max-width:none}
.rs .gh>.art.ga img{height:188px;right:8%}
.rs .gh>.art.ga::before{width:62%;bottom:-24%}
.rs .gh>.art.ga .ga-chip{right:auto;top:auto;left:20px;bottom:20px}}
/* Progress: the end-of-chapter marker (res-guide.js) and "Reset progress" */
.rs .gch .g-end{display:block;height:0;margin:0!important}
.rs .cnav .g-reset{display:block;margin-top:2px;padding:0;border:0;background:none;font:600 12.5px var(--fb);color:var(--muted);text-decoration:underline;text-underline-offset:2px;cursor:pointer}
.rs .cnav .g-reset:hover{color:var(--ink)}
.rs .cnav .g-reset:focus-visible{outline:2px solid var(--royal);outline-offset:2px;border-radius:4px}
@media (prefers-reduced-motion:reduce){.rs .bar i{transition:none}}
/* Breathing room between "In this chapter" and the chapter's screenshot, and after the screenshot */
.rs .gch>.obj+*,.rs .gch>.gimg+*{margin-top:32px}
/* Pillar and chapter guides (parts/resources/guide-series.php) */
.rs .gs-up{display:inline-flex;align-items:center;gap:8px;font-size:14px;color:var(--muted);text-decoration:none;margin-top:-24px}
.rs .gs-up:hover{color:var(--ink)}
.rs .gs-up .sbi{width:16px;height:16px}
.rs .gs-list h2{font-size:clamp(1.5rem,2.4vw,2rem);margin:0 0 16px}
.rs .gs-list ol{list-style:none;margin:0;padding:0;display:grid;gap:10px;counter-reset:gs}
.rs .gs-list li{counter-increment:gs;position:relative;padding-left:44px}
.rs .gs-list li::before{content:counter(gs);position:absolute;left:0;top:14px;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font:750 14px var(--fd);background:var(--line);color:var(--ink)}
.rs .gs-list li>a,.rs .gs-list li.soon{display:grid;gap:4px;padding:14px 18px;border:1px solid var(--line);border-radius:16px;color:var(--ink);text-decoration:none}
.rs .gs-list li>a:hover{border-color:var(--ink)}
.rs .gs-list li span{font-size:14px;color:var(--muted)}
.rs .gs-list li.soon{border-style:dashed;opacity:.7}
.rs.is-series .prose ul.chk{list-style:none;padding-left:0}
.rs.is-series .prose ul.chk>li{position:relative;padding-left:30px}
.rs.is-series .prose ul.chk>li::before{content:"";position:absolute;left:0;top:.3em;width:16px;height:16px;border:2px solid var(--line);border-radius:4px}