.lesson-axis{margin:24px 0 0;border:1px solid #dce6df;border-radius:12px;padding:12px 16px;background:#f8faf7}.lesson-axis>summary{display:flex;justify-content:space-between;gap:12px;align-items:center;list-style:none;padding:5px 0;font-size:14px;font-weight:600;color:#284e3a;cursor:pointer}.lesson-axis>summary::-webkit-details-marker{display:none}.lesson-axis>summary:after{content:'+';font-size:20px}.lesson-axis[open]>summary:after{content:'−'}.lesson-axis summary small{display:block;font-size:11px;font-weight:400;color:#637c6a;margin-top:6px}.lesson-axis ol{list-style:none;padding:0;margin:18px 0 0;position:relative}.lesson-axis ol:before{content:'';position:absolute;left:12px;top:18px;bottom:38px;width:2px;background:#ceddd2}.lesson-axis li{position:relative;margin:0 0 8px}.axis-lesson{display:flex;align-items:flex-start;gap:10px;padding:9px 8px 9px 0;text-decoration:none;border-radius:9px;color:#526b5a;min-height:70px}.axis-lesson:hover{background:#edf4ee}.axis-number{flex-shrink:0;width:26px;height:26px;border:1px solid #c6d8cb;background:#f8faf7;border-radius:50%;display:grid;place-items:center;font-size:11px;z-index:1}.axis-body{display:block;min-width:0}.axis-body strong{font-size:12px;font-weight:600;line-height:1.5;display:block;margin:2px 0 5px}.axis-body small{font-size:10px;display:block;line-height:1.8;color:#637a69}.axis-body em{font-size:10px;font-style:normal;color:#0f766e;display:block;margin-top:4px}.axis-lesson.is-current{background:#e5f1e9;color:#174e38}.is-current .axis-number{background:#0f766e;border-color:#0f766e;color:white}.axis-lesson:focus-visible{outline:3px solid #0f766e;outline-offset:2px}@media(min-width:1280px){.has-lesson-axis main{padding-left:280px;padding-right:40px}.lesson-axis{position:fixed;left:278px;top:128px;bottom:28px;width:218px;overflow:auto;overscroll-behavior:contain;padding:0 10px 16px 0;margin:0;background:transparent;border:0;border-radius:0;z-index:10}.lesson-axis>summary{font-size:15px}.lesson-axis>summary:after{display:none}.lesson-axis ol{margin-top:20px}}@media(max-width:1279px){.lesson-axis{max-width:1060px;margin:24px auto 0}.lesson-axis[open] ol{max-height:420px;overflow:auto;padding-right:4px}.axis-body strong{font-size:13px}.axis-body small{font-size:11px}}
/* Compact lesson rail: numbers only, full names remain accessible. */
@media(min-width:1280px){.has-lesson-axis main{padding-left:126px}.lesson-axis{left:278px;width:54px;padding-right:0}.lesson-axis>summary{display:none}.lesson-axis ol{margin-top:0}.lesson-axis ol:before{left:17px;top:18px;bottom:18px}.lesson-axis li{margin-bottom:15px}.axis-lesson{padding:0;min-height:36px;width:36px;justify-content:center;align-items:center;border-radius:50%}.axis-number{width:36px;height:36px;font-size:12px}.axis-body{display:none}}
@media(max-width:1279px){.lesson-axis{padding:10px 12px}.lesson-axis>summary{font-size:12px}.lesson-axis summary small{display:none}.lesson-axis[open] ol{display:flex;gap:10px;flex-wrap:wrap;margin:12px 0 0;padding:0}.lesson-axis ol:before{display:none}.lesson-axis li{margin:0}.axis-lesson{padding:0;min-height:36px;width:36px;align-items:center;justify-content:center}.axis-number{width:36px;height:36px}.axis-body{display:none}}
@media(min-width:1280px){.lesson-axis{top:50%;bottom:auto;transform:translateY(-50%);max-height:calc(100svh - 64px);overflow:auto}}
@media(min-width:1280px){.lesson-axis{top:0;bottom:0;height:100dvh;max-height:none;transform:none;padding:0;overflow:visible;pointer-events:none}.lesson-axis>nav{position:absolute;top:50%;transform:translateY(-50%);width:54px;max-height:calc(100dvh - 48px);overflow:auto;pointer-events:auto}.lesson-axis ol{margin:0;padding:0}.lesson-axis li:last-child{margin-bottom:0}}
/* Keep lesson content close to the narrow rail instead of centering a 900px column in the remaining space. */
@media(min-width:1280px){.has-lesson-axis main>.content{margin-left:0;margin-right:0}.has-lesson-axis main>.lesson-page{max-width:1060px}.has-lesson-axis main{padding-left:110px}}
@media(min-width:1280px){.has-lesson-axis main{max-width:none;padding-right:32px}.has-lesson-axis main>.content,.has-lesson-axis main>.lesson-page{max-width:none;width:100%;margin-left:0;margin-right:0}}