.cl-lesson{--cl-ink:#e5e7eb;--cl-muted:#aeb9c8;--cl-card:#18212c;--cl-plot:#101923;--cl-border:#3b4b5d;--cl-grid:#293647;max-width:1520px;margin:0 auto;padding:clamp(16px,2.4vw,34px);color:var(--cl-ink)}
body[data-theme="light"] .cl-lesson{--cl-ink:#172033;--cl-muted:#526176;--cl-card:#fff;--cl-plot:#f8fafc;--cl-border:#cbd5e1;--cl-grid:#e5ebf2}
body[data-theme="light"] #slide-player-overlay .cl-stage.is-current{color:#fff!important;-webkit-text-fill-color:#fff!important}
.cl-header{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:18px}.cl-kicker,.cl-card-label{margin:0 0 9px;color:#f18ca5;font-size:.72rem;font-weight:850;letter-spacing:.13em;text-transform:uppercase}.cl-header h1{margin:0;color:#fb7185;font-size:clamp(1.7rem,3vw,2.55rem);font-weight:850;line-height:1.1}.cl-question{margin:9px 0 0;font-size:clamp(1.02rem,1.5vw,1.22rem);font-weight:700}.cl-step-count{flex:none;padding:10px 14px;border:1px solid var(--cl-border);border-radius:999px;background:var(--cl-card);font-size:.82rem;font-weight:800}.cl-stage-track{display:flex;gap:8px;overflow-x:auto;padding:4px 0 14px;margin-bottom:6px}.cl-stage{flex:none;padding:8px 11px;border:1px solid var(--cl-border);border-radius:999px;color:var(--cl-muted);font-size:.76rem}.cl-stage.is-current{background:#0a6877;color:#fff;border-color:#13b8cb;font-weight:800}.cl-stage.is-done{border-color:#169a7a;color:#50d2ad}.cl-workspace{display:grid;grid-template-columns:minmax(270px,.78fr) minmax(420px,1.55fr);gap:16px;align-items:stretch}.cl-explain,.cl-lab{min-width:0;padding:clamp(18px,2vw,28px);border:1px solid var(--cl-border);border-radius:20px;background:var(--cl-card)}.cl-explain h2,.cl-lab h2{margin:0 0 12px;font-size:1.23rem;font-weight:850}.cl-theory,.cl-lab-intro{color:var(--cl-muted);font-size:1rem;line-height:1.7}.cl-simple{margin-top:20px;padding:16px 18px;border-left:4px solid #0b9aaa;border-radius:0 14px 14px 0;background:color-mix(in srgb,#0b9aaa 13%,var(--cl-card))}.cl-simple strong{display:block;margin-bottom:5px}.cl-simple p{margin:0;line-height:1.6}.cl-details{margin-top:17px;border-top:1px solid var(--cl-border);padding-top:13px}.cl-details summary{font-weight:800;cursor:pointer}.cl-details p{font-size:.88rem;line-height:1.55;color:var(--cl-muted)}.cl-lab-top{display:flex;justify-content:space-between;align-items:center;gap:12px}.cl-lab-top h2{margin:0}.cl-reset{border:1px solid var(--cl-border);border-radius:11px;padding:9px 15px;background:var(--cl-card);font-weight:800;cursor:pointer}.cl-reset:hover{border-color:#0b9aaa}.cl-lab-intro{margin:8px 0 14px;font-size:.9rem}.cl-visual{width:100%;border:1px solid var(--cl-border);border-radius:16px;overflow:hidden;background:var(--cl-plot)}.cl-visual svg{display:block;width:100%;height:auto;min-height:240px}.cl-control-row{display:flex;justify-content:space-between;gap:12px;margin:15px 0 8px;font-weight:800}.cl-control-row output{color:#0b9aaa}.cl-slider{width:100%;accent-color:#0b9aaa;cursor:pointer}.cl-live{min-height:62px;margin-top:12px;padding:13px 15px;border-radius:12px;background:color-mix(in srgb,#0b9aaa 12%,var(--cl-card));line-height:1.55}.cl-observation{display:grid;gap:5px;margin-top:13px;color:var(--cl-muted);font-size:.82rem}.cl-observation strong{color:var(--cl-ink)}.cl-footer{display:flex;justify-content:space-between;gap:16px;margin-top:13px;color:var(--cl-muted);font-size:.8rem}.course-outline-capstone{position:relative}.course-outline-capstone .capstone-meta{display:grid;gap:8px;margin:14px 0;color:var(--cl-muted);font-size:.88rem;line-height:1.55}.capstone-actions{display:flex;flex-wrap:wrap;gap:9px;margin-top:14px}.capstone-actions button{border:1px solid #148da0;border-radius:10px;padding:10px 13px;background:#0c7383;color:#fff;font-weight:800;cursor:pointer}.capstone-actions button:hover{background:#0a879a}.course-outline-stat-detail{color:#94a3b8;font-size:.76rem}
body[data-theme="light"] .course-outline-capstone .capstone-meta{color:#405066}body[data-theme="light"] .capstone-actions button{color:#fff!important;-webkit-text-fill-color:#fff!important}
@media(max-width:900px){.cl-workspace{grid-template-columns:1fr}.cl-visual svg{min-height:190px}}@media(max-width:580px){.cl-lesson{padding:12px}.cl-header{display:grid}.cl-step-count{justify-self:start}.cl-stage-track{margin-right:-10px}.cl-footer{display:grid}.cl-visual svg{min-height:150px}}

/* High-contrast course visualization palette shared by SVG models and controls. */
.cl-lesson{--cl-teal:#087f8c;--cl-maroon:#8b1237;--cl-blue:#2356b5;--cl-green:#087e54;--cl-amber:#985000;--cl-title:#ff8fab;--cl-control-ink:#35c7d1;--cl-success-ink:#50d2ad}
body[data-theme="light"] .cl-lesson{--cl-title:#8b1237;--cl-control-ink:#087f8c;--cl-success-ink:#087e54}
.cl-kicker,.cl-card-label{color:var(--cl-title)}
.cl-header h1{color:var(--cl-title)}
.cl-stage.is-current{background:var(--cl-teal);border-color:#27c9d4;color:#fff}
.cl-stage.is-done{border-color:var(--cl-green);color:var(--cl-success-ink)}
.cl-control-row output{color:var(--cl-control-ink)}
.cl-slider{accent-color:var(--cl-control-ink)}
.cl-reset:hover{border-color:var(--cl-control-ink)}
.cl-simple{border-left-color:var(--cl-control-ink);background:color-mix(in srgb,var(--cl-teal) 18%,var(--cl-card))}
.cl-live{background:color-mix(in srgb,var(--cl-teal) 17%,var(--cl-card))}

.cl-run-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:12px}
.cl-run-model{border:1px solid #0b9aaa;border-radius:11px;padding:10px 16px;background:#087f8c;color:#fff;font-weight:850;cursor:pointer;transition:background-color .15s,border-color .15s}
.cl-run-model:hover{background:#066b78;border-color:#13b8cb}
.cl-run-model:focus-visible{outline:3px solid #f59e0b;outline-offset:2px}
.cl-run-status{color:var(--cl-muted);font-size:.82rem;line-height:1.45}
.cl-run-model[data-pending="true"]{box-shadow:0 0 0 2px color-mix(in srgb,#f59e0b 40%,transparent)}
#slide-player-overlay main{min-height:0;overflow:hidden!important}
#slide-player-body{min-height:0;height:auto!important;overflow-y:auto;overscroll-behavior:contain}
#slide-player-controls-footer{flex:0 0 auto;background:rgba(9,9,11,.96);backdrop-filter:blur(8px)}
@media(max-width:640px){.cl-run-row{align-items:stretch}.cl-run-model{width:100%}.cl-run-status{width:100%}#slide-player-controls-footer{gap:8px;padding-bottom:calc(10px + env(safe-area-inset-bottom))}}

body[data-theme="light"] #slide-player-controls-footer{background:rgba(248,250,252,.98);border-top-color:#cbd5e1!important}
body[data-theme="light"] #slide-player-controls-footer #player-btn-prev,
body[data-theme="light"] #slide-player-controls-footer #player-btn-next{background:#fff;color:#172033!important;border-color:#cbd5e1!important}
body[data-theme="light"] #slide-player-controls-footer #player-slide-indicator{color:#334155!important}
