/* Lesson 03: static replay and independently simulated candidate boards. */
.slide[data-slide-id="method-primary"] .changing-example {
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:14px;
}
.changing-board-row { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,2fr); column-gap:24px; align-items:start; }
.changing-board-figure { display:grid; gap:10px; min-width:0; text-align:center; align-content:start; }
.changing-board-figure h3 { font-size:var(--l03-body,28px); line-height:1.4; }
.changing-board-figure .board { width:min(100%,300px); max-width:300px; }
.changing-board-figure .cell { font-size:clamp(24px,2.2vw,36px); }
.changing-board-figure .cell.spawned { outline:4px solid #bd8d35; outline-offset:-5px; }
.changing-frame-caption,
.changing-candidate-caption { display:grid; gap:4px; min-height:3.3em; font-size:var(--l03-hint,23px); line-height:1.45; color:var(--muted); }
.changing-frame-caption { align-content:start; padding-top:4px; }
.changing-frame-caption #primaryStage { color:var(--ink); font-weight:600; }
.changing-rule { font-size:var(--l03-body,28px); line-height:1.4; }
.changing-candidates { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:24px; }
.changing-candidate.best .board { outline:3px solid #a67d2e; outline-offset:3px; }
.changing-candidate .cell.empty { background:#e7f0dd; color:#24483e; box-shadow:none; border:2px dashed #4e705e; }
.changing-candidate-caption b { font-size:var(--l03-body,28px); line-height:1.4; color:var(--ink); }
.changing-conclusion { font-size:var(--l03-body,28px); line-height:1.5; min-height:1.5em; }
.changing-controls { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; column-gap:22px; row-gap:8px; }
.changing-actions { gap:10px; flex-shrink:0; }
.changing-limit { font-size:var(--l03-hint,23px); line-height:1.45; color:var(--muted); }
.slide[data-slide-id="algorithm"] .case-actions { gap:10px; margin-top:10px; }
.slide[data-slide-id="algorithm"] .case-actions button { padding:8px 12px; }
.slide[data-slide-id="algorithm"] #algoBoardLabel { min-height:4.5em; }
@media(max-height:760px) and (min-width:901px) {
  .slide[data-slide-id="method-primary"] .changing-example { gap:10px; }
  .changing-board-figure { gap:8px; }
  .changing-board-figure .board { width:min(100%,240px); max-width:240px; }
  .changing-board-figure .cell { font-size:24px; }
  .changing-board-row,.changing-candidates { column-gap:20px; }
  .slide[data-slide-id="algorithm"] .steps { margin-bottom:12px; }
  .slide[data-slide-id="algorithm"] .algorithm-layout .algo-copy { min-height:4.5em; }
  .slide[data-slide-id="algorithm"] .candidates { margin:10px 0; }
  .slide[data-slide-id="algorithm"] .case-actions { margin-top:7px; }
  .slide[data-slide-id="algorithm"] .algorithm-layout > div > p.small { margin-top:10px!important; }
}
@media(max-width:900px) {
  .changing-board-row { grid-template-columns:minmax(0,1fr); row-gap:24px; }
  .changing-board-figure .board { width:min(100%,285px); }
  .changing-frame-caption { min-height:0; }
  .changing-candidates { column-gap:18px; }
  .changing-conclusion { min-height:0; }
}
@media(max-width:500px) {
  .changing-candidates { grid-template-columns:minmax(0,1fr); row-gap:24px; }
}
