/* Chapters rail as an Apple-style side selector: collapsed "+" pills, the current chapter expands into a card,
   up/down stepper and close button. Built by rail.js on top of the existing <aside class="rail"> (kept hidden for i18n + no-JS). */
.rail.sr-on>ol{display:none}
.rail.sr-on{padding-top:28px;top:calc(var(--nav) + 20px)}
.rail.sr-on .kick{margin-bottom:14px}
.ss-root{position:relative}
.sr-tools{display:flex;align-items:center;gap:8px;height:34px;margin:0 0 10px;opacity:0;transform:translateY(4px);pointer-events:none;transition:opacity .3s ease,transform .3s ease}
.ss-root.has-active .sr-tools{opacity:1;transform:none;pointer-events:auto}
.sr-step{display:flex;gap:6px}
.sr-arrow,.sr-close{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;padding:0;border:1px solid var(--line);border-radius:50%;background:var(--card,#fff);color:var(--ink);font:500 15px/1 var(--sans);cursor:pointer;transition:transform .25s cubic-bezier(.34,1.56,.64,1),background .25s ease}
.sr-close{margin-left:auto}
.sr-arrow:hover:not(:disabled),.sr-close:hover{background:var(--pink-soft);transform:scale(1.08)}
.sr-arrow:active:not(:disabled),.sr-close:active{transform:scale(.94)}
.sr-arrow:disabled{opacity:.3;cursor:not-allowed}
.sr-list{display:flex;flex-direction:column;gap:8px;margin:0;padding:0;list-style:none}
.sr-item{width:100%}
.sr-pill{display:flex;align-items:center;gap:12px;width:fit-content;max-width:100%;height:40px;padding:0 20px 0 8px;border:1px solid var(--line);border-radius:9999px;background:var(--card,#fff);color:var(--ink-2,var(--ink));font:600 14px/1 var(--sans);letter-spacing:-.005em;text-align:left;cursor:pointer;transition:background .25s ease,transform .25s cubic-bezier(.34,1.56,.64,1),border-color .25s ease}
.sr-pill:hover{background:var(--pink-soft);transform:scale(1.02)}
.sr-pill:active{transform:scale(.96)}
.sr-item.current:not(.active) .sr-pill{border-color:var(--ink);color:var(--ink)}
.sr-icon{display:inline-flex;align-items:center;justify-content:center;flex:none;width:22px;height:22px;border:1.5px solid currentColor;border-radius:50%;font:500 15px/1 var(--sans);opacity:.8}
.sr-card{display:none;width:min(268px,calc(100% + 60px));padding:18px 20px;border:1px solid var(--line);border-radius:22px;background:var(--card,#fff);box-shadow:0 22px 40px -26px rgba(64,44,28,.4);font:500 15px/1.5 var(--sans);color:var(--ink-2,var(--ink))}
.sr-card b{display:block;margin-bottom:4px;font:300 24px/1.1 var(--serif);letter-spacing:-.02em;color:var(--ink)}
.sr-card .n{display:block;margin-bottom:8px;font:400 11px/1 var(--mono);letter-spacing:.08em;color:var(--muted)}
.sr-item.active .sr-pill{display:none}
.sr-item.active .sr-card{display:block;animation:srIn .45s cubic-bezier(.16,1,.3,1) both}
@keyframes srIn{from{opacity:0;transform:translateY(8px) scale(.97);filter:blur(3px)}to{opacity:1;transform:none;filter:blur(0)}}
html[data-theme="dark"] .sr-card{box-shadow:0 22px 40px -26px rgba(0,0,0,.7)}
@media (prefers-reduced-motion:reduce){.sr-item.active .sr-card{animation:none}.sr-pill,.sr-arrow,.sr-close{transition:background .2s ease}}
