/* Shared task brief, sample-output preview, syntax highlighting, and semantic submission checker. */
.lab-challenge{
  display:grid;
  grid-template-columns:minmax(0,1fr) 188px;
  gap:18px;
  align-items:start;
  padding:15px 22px;
  border-bottom:1px solid color-mix(in srgb,var(--course-accent,#0c8f96) 22%,transparent);
  background:linear-gradient(135deg,color-mix(in srgb,var(--course-accent,#0c8f96) 7%,transparent),transparent 62%)
}
.lab-challenge-main{min-width:0;display:grid;gap:8px}
.lab-challenge-formulas{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.lab-challenge-formulas[hidden]{display:none}
.lab-formula{
  min-width:min(100%,250px);
  padding:7px 12px;
  border:1px solid color-mix(in srgb,var(--course-accent,#0c8f96) 24%,transparent);
  border-radius:11px;
  background:color-mix(in srgb,var(--paper,#fff) 82%,transparent);
  overflow-x:auto;
  color:var(--text,#18333a)
}
.lab-formula mjx-container{margin:0!important;min-width:max-content}
.lab-challenge-steps{
  margin:0;
  padding-left:1.55rem;
  display:grid;
  gap:5px;
  color:var(--text,#18333a);
  font:650 .88rem/1.55 ui-sans-serif,system-ui,sans-serif
}
.lab-challenge-steps li::marker{color:var(--course-accent,#0c8f96);font-weight:900}
.lab-challenge-side{display:grid;align-self:center;gap:7px}
.lab-submit,.lab-sample-output{
  appearance:none;
  min-height:40px;
  border:1px solid color-mix(in srgb,var(--course-accent,#0c8f96) 52%,transparent);
  border-radius:12px;
  padding:8px 14px;
  background:color-mix(in srgb,var(--course-accent,#0c8f96) 10%,transparent);
  color:var(--course-accent,#0c8f96);
  font:850 .82rem/1.1 ui-sans-serif,system-ui,sans-serif;
  cursor:pointer;
  transition:transform .16s ease,background .16s ease,border-color .16s ease,color .16s ease
}
.lab-submit:hover,.lab-sample-output:hover{transform:translateY(-1px);background:color-mix(in srgb,var(--course-accent,#0c8f96) 19%,transparent);border-color:var(--course-accent,#0c8f96)}
.lab-submit:active,.lab-sample-output:active{transform:translateY(0)}
.lab-submit:focus-visible,.lab-sample-output:focus-visible{outline:2px solid var(--course-accent,#0c8f96);outline-offset:2px}
.lab-submit:disabled,.lab-sample-output:disabled{cursor:wait;opacity:.7;transform:none}
.lab-sample-output.active{background:var(--course-accent,#0c8f96);border-color:var(--course-accent,#0c8f96);color:#fff;box-shadow:0 5px 16px color-mix(in srgb,var(--course-accent,#0c8f96) 25%,transparent)}
.lab-submit-status{
  min-height:0;
  border-radius:9px;
  padding:7px 9px;
  background:color-mix(in srgb,var(--text,#18333a) 4%,transparent);
  color:var(--muted,#627b80);
  font:650 .7rem/1.4 ui-sans-serif,system-ui,sans-serif;
  text-align:center
}
.lab-submit-status[data-state="idle"]:empty{display:none}
.lab-submit-status[data-state="pass"]{background:rgba(45,177,123,.12);color:#19845b}
.lab-submit-status[data-state="fail"]{background:rgba(230,155,44,.13);color:#9b5d08}
.lab-submit-status[data-state="error"]{background:rgba(222,83,75,.12);color:#b83a34}
.lab-submit-status[data-state="checking"]{background:color-mix(in srgb,var(--course-accent,#0c8f96) 11%,transparent);color:var(--course-accent,#0c8f96)}
.lab-status.sample{color:var(--course-accent,#0c8f96)}
.lab-sample-figures{
  display:grid;gap:9px;padding:8px 12px 12px;overflow:auto;border-top:1px solid color-mix(in srgb,var(--course-accent,#0c8f96) 16%,transparent)
}
.lab-sample-figures img{
  display:block;width:100%;height:auto;max-height:300px;object-fit:contain;border:1px solid color-mix(in srgb,var(--course-accent,#0c8f96) 18%,transparent);border-radius:10px;background:var(--paper,#fff)
}
.matlab-lab.is-command-window.is-sample-output .lab-code-pane{display:none!important}
.matlab-lab.is-command-window.is-sample-output .lab-result-pane{display:flex!important;flex-basis:100%!important}
.matlab-lab.is-command-window.is-sample-output .lab-body{display:flex!important}
:root[data-theme="dark"] .lab-challenge,html[data-theme="dark"] .lab-challenge{background:linear-gradient(135deg,rgba(74,205,211,.08),transparent 65%);border-bottom-color:rgba(101,221,214,.16)}
:root[data-theme="dark"] .lab-challenge-steps,html[data-theme="dark"] .lab-challenge-steps{color:#dcebea}
:root[data-theme="dark"] .lab-formula,html[data-theme="dark"] .lab-formula{background:rgba(255,255,255,.035);color:#e1f0ef;border-color:rgba(101,221,214,.16)}
:root[data-theme="dark"] .lab-submit-status,html[data-theme="dark"] .lab-submit-status{background:rgba(255,255,255,.045);color:#95afb2}
:root[data-theme="dark"] .lab-submit-status[data-state="pass"],html[data-theme="dark"] .lab-submit-status[data-state="pass"]{background:rgba(55,194,137,.12);color:#65d7a4}
:root[data-theme="dark"] .lab-submit-status[data-state="fail"],html[data-theme="dark"] .lab-submit-status[data-state="fail"]{background:rgba(239,170,57,.12);color:#efb75e}
:root[data-theme="dark"] .lab-submit-status[data-state="error"],html[data-theme="dark"] .lab-submit-status[data-state="error"]{background:rgba(235,94,87,.12);color:#ff9c96}
@media(max-width:760px){
  .lab-challenge{grid-template-columns:minmax(0,1fr);gap:13px;padding:14px 16px}
  .lab-challenge-side{grid-template-columns:1fr 1fr;align-items:start}
  .lab-submit-status{grid-column:1/-1;min-height:36px;display:flex;align-items:center;justify-content:center}
  .lab-formula{width:100%;box-sizing:border-box}
}
@media(max-width:440px){
  .lab-challenge-steps{font-size:.8rem;line-height:1.5}
  .lab-challenge-side{grid-template-columns:1fr}
  .lab-submit-status{grid-column:auto}
}

/* Shared MATLAB syntax highlighting for all embedded editors, including legacy lessons. */
.lab-editor-wrap{position:relative}
.lab-code-highlight{
  position:absolute;z-index:1;box-sizing:border-box;margin:0;border:0;overflow:hidden;pointer-events:none;
  white-space:pre;word-break:normal;overflow-wrap:normal;color:var(--text,#18333a);background:transparent
}
.lab-editor.has-syntax-highlight{position:relative;z-index:2;color:transparent!important;-webkit-text-fill-color:transparent!important;background:transparent!important;caret-color:var(--course-accent,#65ddd6)!important}
.lab-editor.has-syntax-highlight::selection{background:color-mix(in srgb,var(--course-accent,#0c8f96) 28%,transparent);color:transparent;-webkit-text-fill-color:transparent}
.lab-code-highlight .tok-key{color:#2874c6;font-weight:800}
.lab-code-highlight .tok-fn{color:#985db6}
.lab-code-highlight .tok-str{color:#c3423f}
.lab-code-highlight .tok-num{color:#178c63}
.lab-code-highlight .tok-comment{color:#3e9a53}
:root[data-theme="dark"] .lab-code-highlight,html[data-theme="dark"] .lab-code-highlight{color:#e7f6f5}
:root[data-theme="dark"] .lab-code-highlight .tok-key,html[data-theme="dark"] .lab-code-highlight .tok-key{color:#78b7ff}
:root[data-theme="dark"] .lab-code-highlight .tok-fn,html[data-theme="dark"] .lab-code-highlight .tok-fn{color:#d9a0f4}
:root[data-theme="dark"] .lab-code-highlight .tok-str,html[data-theme="dark"] .lab-code-highlight .tok-str{color:#ff9b93}
:root[data-theme="dark"] .lab-code-highlight .tok-num,html[data-theme="dark"] .lab-code-highlight .tok-num{color:#66d2a3}
:root[data-theme="dark"] .lab-code-highlight .tok-comment,html[data-theme="dark"] .lab-code-highlight .tok-comment{color:#72c883}

/* Sample figures use the same full-width lower figure area as learner plots. */
.lab-sample-large-figures{
  display:grid;
  gap:16px;
  width:100%;
  min-height:360px;
  padding:18px;
  align-items:start;
  background:var(--paper,#fff)
}
.lab-sample-large-figures img{
  display:block;
  width:100%;
  max-width:1180px;
  height:auto;
  max-height:none;
  margin:0 auto;
  object-fit:contain;
  border:1px solid color-mix(in srgb,var(--course-accent,#0c8f96) 20%,transparent);
  border-radius:14px;
  background:var(--paper,#fff);
  box-shadow:0 14px 38px color-mix(in srgb,#000 10%,transparent)
}
:root[data-theme="dark"] .lab-sample-large-figures,html[data-theme="dark"] .lab-sample-large-figures{
  background:var(--paper,#0d1b1f)
}
:root[data-theme="dark"] .lab-sample-large-figures img,html[data-theme="dark"] .lab-sample-large-figures img{
  border-color:rgba(101,221,214,.18);
  background:#071113
}
@media(max-width:760px){
  .lab-sample-large-figures{min-height:260px;padding:10px}
}