#spj{font:14px/1.5 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#343b3e;clear:both;margin:20px 0 28px;max-width:100%;min-width:0;text-align:left}
#spj *{box-sizing:border-box}#spj [hidden]{display:none!important}
#spj details{border:1px solid #ddd;border-radius:4px;background:white}
#spj summary{display:flex;align-items:center;gap:10px;cursor:pointer;list-style:none;padding:13px 16px;font-weight:600;background:#fafafa}
#spj summary::-webkit-details-marker{display:none}#spj summary:after{content:'+';font-size:22px;font-weight:400;margin-left:auto}
#spj details[open]>summary:after{content:'−'}#spj details[open]>summary{border-bottom:1px solid #e3e3e3}
#spj .spm-pin{width:18px;height:22px;color:#a77815;flex-shrink:0}
#spj .spm-location{font-size:12px;font-weight:400;color:#687078;margin-left:auto;padding-left:10px}
#spj .spm-toolbar{display:flex;align-items:center;gap:12px;justify-content:space-between;padding:10px 14px;border-bottom:1px solid #eee;flex-wrap:wrap}
#spj button{font:inherit!important;color:#3b525c!important;background:#fff!important;border:1px solid #d7dcde;border-radius:3px;padding:7px 10px!important;line-height:1.2!important;text-transform:none!important;letter-spacing:normal!important;float:none;box-shadow:none;margin:0;min-height:34px;cursor:pointer}
#spj button:hover{background:#f5f7f8!important}#spj button:focus-visible,#spj a:focus-visible,#spj summary:focus-visible{outline:3px solid #1b758b;outline-offset:2px}
#spj .spm-hint{font-size:12px;color:#6b6f72;margin-right:auto}
#spj .spm-window{width:100%;overflow:auto;background:#fff;overscroll-behavior:contain}
#spj .spm-sheet{position:relative;width:100%;isolation:isolate;line-height:0}
#spj .spm-sheet>img{display:block;width:100%!important;height:auto!important;max-width:none!important;margin:0!important;border:0;padding:0;opacity:1!important}
#spj .spm-highlight{position:absolute;background:rgba(255,219,61,.56);border:2px solid #d7a900;border-radius:3px;mix-blend-mode:multiply;pointer-events:none}
#spj .spm-sheet .spm-hotspot{display:block;position:absolute;margin:0;padding:0;background:transparent;border:1px solid transparent;border-radius:2px;text-decoration:none;z-index:2;cursor:pointer;line-height:1}
#spj .spm-hotspot:hover,#spj .spm-hotspot:focus-visible{background:rgba(114,188,210,.22);border-color:#5292a2;mix-blend-mode:multiply}
#spj .spm-sheet .spm-marker{position:absolute;display:flex;align-items:center;gap:4px;font-size:clamp(8px,1vw,11px);line-height:1.3;background:#f6d851;color:#34300a;padding:3px 6px;border-radius:3px;pointer-events:none;white-space:nowrap;z-index:3}
#spj .spm-window.spm-enlarged{max-height:75vh}#spj .spm-enlarged .spm-sheet{width:max(860px,160%)}
#spj .spm-caption{font-size:11px;line-height:1.5;padding:10px 14px;border-top:1px solid #eee;color:#757575}
#spj .spm-caption a{color:#526873;text-decoration:underline;text-underline-offset:2px}
#spj h2{font:600 24px/1.25 system-ui,sans-serif;letter-spacing:normal;text-transform:none;color:#343b3e;margin:0 0 8px}
#spj .spm-intro{margin:0 0 18px;color:#6b6f72;font-size:14px}
body.spm-hub #primary{width:100%!important;float:none!important}body.spm-hub #secondary{display:none!important}body.spm-hub .main-title-section-wrapper{display:none!important}
body.spm-hub #spj{max-width:860px;margin:30px auto}#spj.spm-hub-root .spm-map{border:1px solid #ddd;border-radius:4px;overflow:hidden}
@media(max-width:540px){#spj summary{flex-wrap:wrap;gap:7px;padding:12px}#spj .spm-location{order:3;flex-basis:100%;margin:0;padding-left:25px}#spj .spm-toolbar{gap:8px;padding:8px}#spj .spm-hint{order:3;flex-basis:100%}#spj .spm-toolbar button{font-size:12px!important}#spj .spm-sheet .spm-marker{padding:2px 3px;font-size:8px}}
#spj .spm-exams{display:flex;gap:6px;padding:12px 14px 8px;flex-wrap:wrap}
#spj .spm-exams button{border-color:transparent;font-weight:600!important;font-size:13px!important}
#spj .spm-exams button[aria-pressed=true]{background:#e9f2f8!important;border-color:#c8deed;color:#286487!important}
#spj .spm-rotations{display:flex;gap:6px;padding:2px 14px 10px;flex-wrap:wrap}
#spj .spm-rotations button{font-size:12px!important;min-height:32px}
#spj .spm-rotations button[aria-pressed=true]{border-color:#4186ae;color:#286487!important;background:#f2f8fc!important}
#spj .spm-context{padding:4px 14px 12px;border-bottom:1px solid #eee}
#spj .spm-stage{font-size:11px;color:#707980;margin-bottom:3px}
#spj .spm-match{font-size:13px;color:#42494e}
#spj .spm-context[data-match=related] .spm-match{color:#396b84}
#spj .spm-highlight.spm-related{background:rgba(99,174,211,.09);border:2px dashed #397999;mix-blend-mode:normal}
#spj .spm-edition-note{display:block;margin-top:5px}
#spj .spm-sheet{container-type:inline-size}
#spj .spm-sheet .spm-marker{font-size:1.65cqw;padding:.4cqw .8cqw}
@media(max-width:540px){#spj .spm-exams{gap:3px;padding:10px 8px 6px}#spj .spm-exams button{font-size:11px!important;padding:7px!important}#spj .spm-rotations{padding:3px 8px 8px}#spj .spm-rotations button{font-size:11px!important}#spj .spm-context{padding:4px 10px 10px}#spj .spm-match{font-size:12px}}

/* Keep the roadmap close to lesson tabs; replace the theme spacer here only. */
article.dt-sc-lesson-single > #spj{margin-bottom:10px}
article.dt-sc-lesson-single > #spj + .dt-sc-clear + .dt-sc-hr-invisible-small{display:none}
/* Leading audio uses the roadmap gap; preserve spacing around later players. */
article.dt-sc-lesson-single > #spj ~ .entry > .smart-track-player:nth-child(1 of :not(style,script,[hidden])){margin-top:0!important}
#spj .spm-loading{padding:15px;color:#687078;font-size:13px}
#spj .spm-exams button:disabled{opacity:.65;cursor:wait}
#spj .spm-sheet .spm-marker{font-size:1.65cqw}
#spj .spm-study{display:flex;flex-wrap:wrap;align-items:center;gap:7px 10px;padding:12px 14px 10px;border-bottom:1px solid #e6eaed;background:#fbfcfd}
#spj .spm-study label{font-size:12px;font-weight:600;margin:0;white-space:nowrap}
#spj .spm-study select{font:13px/1.3 system-ui,sans-serif;color:#343b3e;background-color:#fff;border:1px solid #cfd8de;border-radius:3px;padding:7px 28px 7px 9px;height:auto;min-height:36px;max-width:100%;min-width:0;flex:1;width:0;margin:0;box-shadow:none}
#spj .spm-study select:focus-visible{outline:3px solid #1b758b;outline-offset:2px}
#spj .spm-study select:disabled{opacity:.65}
/* The live LMS theme may wrap newly added native selects after initialization. */
#spj .spm-study>.selection-box{flex:1;min-width:0;width:0;margin:0}
#spj .spm-study>.selection-box select{width:100%}
#spj .spm-study>.selection-box:after{height:calc(100% - 2px)}
@media(max-width:540px){#spj .spm-study>.selection-box{flex-basis:100%;width:100%}}
#spj .spm-study-note{flex-basis:100%;font-size:11px;line-height:1.45;color:#687078;min-height:16px}
#spj .spm-study-note button{font-size:11px!important;min-height:24px;padding:3px 6px!important;margin-left:4px}
@media(max-width:540px){#spj .spm-study{padding:10px}#spj .spm-study label{flex-basis:100%}#spj .spm-study select{flex-basis:100%;width:100%;font-size:16px}}

/* Comfortable touch controls without changing the official document layout. */
#spj .spm-image-status{padding:18px 14px;color:#52616b;line-height:1.7}
#spj .spm-image-status a{text-decoration:underline;color:#286487}
#spj .spm-image-status button{margin:0 4px}
@media(max-width:540px){#spj button,#spj .spm-rotations button{min-height:44px;min-width:44px}#spj .spm-exams{display:grid;grid-template-columns:1fr 2fr 1fr 1fr}#spj .spm-exams button{min-width:0}#spj .spm-exams button,#spj .spm-rotations button{font-size:12px!important}#spj .spm-study select{min-height:44px}#spj .spm-hint{font-size:12px}}