/* Shared execution workspace: source, state, step insight, then terminal. */
.execution-workspace{container-type:inline-size;border:1px solid var(--section-edge,var(--border));border-radius:18px;background:var(--panel);min-width:0;margin-top:24px}
.execution-header{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 22px;border-bottom:1px solid var(--section-edge,var(--border));background:var(--section-soft,var(--code));border-radius:17px 17px 0 0}
.execution-heading{display:flex;align-items:center;gap:12px;min-width:0}
.execution-mark{display:grid;place-items:center;flex:0 0 36px;width:36px;height:36px;border-radius:11px;color:var(--section-ink,var(--accent));background:var(--panel);font-size:23px;line-height:1}
.execution-title{font-size:var(--text-subheading);font-weight:700;line-height:1.4}
.execution-header .simulation-note{font-size:var(--text-body);line-height:var(--leading-body);margin:4px 0 0;max-width:38ch}
.execution-header .sample-input{display:flex;flex-direction:column;align-items:flex-start;gap:7px;margin:0;max-width:45%;min-width:0;font-size:var(--text-label);font-weight:650;color:#235a9c}
.execution-header .sample-input select{width:100%;min-width:0;min-height:48px;padding:10px 34px 10px 14px;border:2px solid #4e89d8;border-radius:10px;font-size:var(--text-label);font-weight:650;line-height:1.5;background:var(--panel);color:var(--text);cursor:pointer;box-shadow:0 3px 8px #1b4e8912;transition:border-color 140ms ease,box-shadow 140ms ease}
.execution-header .sample-input select:hover{border-color:#235a9c;box-shadow:0 0 0 3px #4e89d820}
:root[data-theme=dark] .execution-header .sample-input{color:#afd0ff}
:root[data-theme=dark] .execution-header .sample-input select{border-color:#81b5fa;background:#203044}
:root[data-theme=dark] .execution-header .sample-input select:hover{border-color:#b1d1ff;box-shadow:0 0 0 3px #81b5fa25}
.execution-workspace .player-grid{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:0;align-items:stretch}
.execution-workspace .code-pane{background:#17211c;color:#e1eae4;border-right:1px solid var(--section-edge,var(--border))}
.execution-workspace .pane-header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;min-height:49px;padding:12px 18px;border-bottom:1px solid var(--border)}
.execution-workspace .code-pane .pane-header,.execution-workspace .output-pane .pane-header{border-color:#35483c;color:#cbdcd0;background:#1c2922}
.execution-workspace .pane-title{font-size:var(--text-label);letter-spacing:.06em;margin:0;color:inherit}
.execution-workspace .pane-tag{font-size:var(--text-label);line-height:1.5;opacity:.75}
.execution-workspace .trace-code{border:0;border-radius:0;padding:18px 0;min-height:280px;max-height:520px;margin:0;font-size:var(--text-code)}
.execution-workspace .trace-line{padding:0 18px}
.execution-workspace .state-pane{background:var(--panel);min-width:0}
.execution-workspace .state-pane .pane-header{color:var(--muted);background:var(--panel)}
.execution-workspace .scope-label{margin:0;font-size:var(--text-label);line-height:1.5;padding:3px 7px;border-radius:6px;background:var(--section-soft,var(--code));color:var(--section-ink,var(--accent));max-width:100%;overflow-wrap:anywhere}
.execution-workspace .state-content{padding:14px 18px;min-height:280px;max-height:520px;overflow:auto;font-size:var(--text-code)}
.execution-workspace .value-diagram{margin:0;min-height:190px;font-size:var(--text-code)}
.execution-workspace .value-row{display:grid;grid-template-columns:minmax(0,.8fr) 16px minmax(0,1.2fr);gap:8px;margin:0;padding:10px 0;border-bottom:1px solid var(--border)}
.execution-workspace .name-node{border:0;background:var(--section-soft,var(--code));color:var(--section-ink,var(--accent));padding:5px 8px;font-size:var(--text-code);max-width:100%;width:fit-content}
.execution-workspace .reference-target{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:var(--text-code);overflow-wrap:anywhere;min-width:0}
.execution-workspace .reference-arrow{text-align:center;color:var(--muted)}
.execution-workspace .object-pool{gap:8px;margin:16px 0 4px}
.execution-workspace .object-node{background:var(--section-soft,var(--code));border-color:var(--section-edge,var(--border));padding:9px 10px;gap:5px}
.execution-workspace .calculation{margin-top:16px;min-height:36px;line-height:1.75;color:var(--section-ink,var(--accent));overflow-wrap:anywhere}
.execution-workspace .step-insight{display:grid;grid-template-columns:76px minmax(0,1fr);align-items:start;gap:12px;padding:18px 22px;border-top:1px solid var(--section-edge,var(--border));background:var(--section-soft,var(--accent-soft));min-height:88px}
.insight-label{font-size:var(--text-label);font-weight:700;color:var(--section-ink,var(--accent));padding-top:2px}
.execution-workspace .player-explanation{border:0;background:none;padding:0;margin:0;border-radius:0;font-size:var(--text-body);line-height:var(--leading-body);min-height:47px}
.execution-workspace .output-pane{border-radius:0 0 17px 17px;background:#17211c;color:#cbdcd0;border-top:1px solid #35483c;overflow:hidden}
.execution-workspace .player-output{border:0;border-radius:0;padding:18px 22px;min-height:112px;max-height:280px;margin:0;font-size:var(--text-code);line-height:1.8;overflow:auto}
.execution-workspace .terminal-body{position:relative;display:grid;min-height:220px}
.execution-workspace .terminal-body>.player-output,.execution-workspace .terminal-body>.prediction{grid-area:1/1}
.execution-workspace .terminal-body>.player-output{transition:filter 180ms ease}
.enhanced .terminal-body:has(>.prediction:not([hidden]))>.player-output{filter:blur(5px);pointer-events:none;user-select:none}
.execution-workspace .terminal-body>.prediction{position:relative;z-index:1;align-self:center;background:var(--panel);color:var(--text);border:1px solid var(--section-edge,var(--border));border-radius:14px;padding:20px;margin:20px;gap:16px;box-shadow:0 8px 28px #0004}
.execution-workspace .prediction p{font-size:var(--text-body)}
.execution-workspace .terminal-body>.prediction p{flex:1 1 220px}
.execution-workspace .prediction button{min-height:48px;padding:11px 20px;background:#9ce5bd;color:#133723;border:1px solid #b7f2d1;border-radius:10px;font-size:var(--text-label);font-weight:750;cursor:pointer;box-shadow:0 3px 12px #0003;transition:background-color 140ms ease,box-shadow 140ms ease}
.execution-workspace .prediction button:hover{background:#b7f2d1;box-shadow:0 4px 16px #0005}
.execution-workspace .prediction button:active{background:#83d7a9;box-shadow:0 1px 4px #0003}
.execution-workspace .prediction button:focus-visible{outline-color:#afd0ff}
.concept-player .step-insight{border-radius:0}

@media(max-width:1100px){.execution-header{align-items:flex-start;gap:14px}.execution-header .sample-input{max-width:48%}.execution-workspace .player-grid{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}.execution-mark{display:none}.execution-workspace .pane-header{padding:12px 14px}.execution-workspace .state-content{padding:12px 14px}}
@media(max-width:900px){.execution-workspace .player-grid{grid-template-columns:1fr}.execution-workspace .code-pane{border-right:0;border-bottom:1px solid var(--section-edge,var(--border))}.execution-workspace .trace-code{min-height:210px;max-height:420px}.execution-workspace .state-content{min-height:180px;max-height:360px}.execution-workspace .value-diagram{min-height:100px}}
@media(max-width:650px){.execution-workspace{margin-top:20px;border-radius:14px}.execution-header{flex-direction:column;padding:16px;border-radius:13px 13px 0 0;gap:14px}.execution-header .sample-input{max-width:100%;width:100%}.execution-header .simulation-note{max-width:none}.execution-workspace .step-insight{grid-template-columns:1fr;gap:6px;padding:16px;min-height:102px}.execution-workspace .player-output,.execution-workspace .prediction{padding:16px}.execution-workspace .trace-code{font-size:var(--text-code)}.execution-workspace .trace-line{padding:0 13px}.execution-workspace .output-pane,.concept-player .step-insight{border-radius:0 0 13px 13px}.execution-workspace .player-explanation{min-height:0}}
@media(max-width:650px){.execution-workspace .prediction button{width:100%}.execution-workspace .terminal-body>.prediction{padding:16px;margin:12px;gap:12px}}
@media(prefers-reduced-motion:reduce){.execution-header .sample-input select,.execution-workspace .prediction button,.execution-workspace .terminal-body>.player-output{transition:none}}

/* Reserve the changing panes; controls follow the measured explanation. */
.execution-workspace .pane-header{height:64px;flex-wrap:nowrap}
.execution-workspace .pane-title{flex-shrink:0}
.execution-workspace .scope-label{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.execution-workspace .trace-code{height:320px;min-height:320px;max-height:320px}
.execution-workspace .state-content{height:320px;min-height:320px;max-height:320px}
.execution-workspace>.player-controls{margin:0;border-radius:0;border-width:1px 0 0;box-shadow:none}
.enhanced .execution-controls{position:static;display:grid;grid-template-columns:max-content minmax(108px,1fr) max-content;align-items:center;gap:12px;padding:12px 18px;min-height:66px;background:var(--execution-controls-bg);border-color:var(--controls-border)}
.transport-actions{display:grid;grid-template-columns:40px 96px 110px;align-items:center;gap:6px}
.execution-controls .step-counter{justify-self:start;margin:0;font-variant-numeric:tabular-nums;white-space:nowrap}
.execution-controls button[data-action=play]{background:var(--panel);color:var(--text);border:1px solid var(--controls-border)}
.execution-controls button[data-action=next]{background:var(--accent);color:var(--panel)}
.execution-controls button[data-action=reset]{grid-column:3;justify-self:end;width:auto;min-width:88px;padding:0 12px;font-size:var(--text-label);color:var(--muted);background:transparent}
.execution-controls button[data-action=next]:hover{background:var(--accent);filter:brightness(.94)}
.concept-player .execution-controls{border-radius:0 0 17px 17px}
.legacy-controls.execution-controls{border-radius:12px;margin:12px 0 0}
@media(max-width:900px){.execution-workspace .trace-code{height:210px;min-height:210px;max-height:210px}.execution-workspace .state-content{height:180px;min-height:180px;max-height:180px}}
@container(max-width:580px){
  .enhanced .execution-controls{grid-template-columns:minmax(0,1fr) max-content;grid-template-rows:40px 36px;gap:8px;padding:8px;min-height:104px}
  .transport-actions{grid-column:1/-1;grid-row:1;grid-template-columns:32px minmax(80px,1fr) minmax(100px,1.15fr);gap:4px}
  .execution-controls button[data-action=back]{width:32px;min-width:0}
  .execution-controls button[data-action=play],.execution-controls button[data-action=next]{min-width:0;padding:0 6px;gap:5px}
  .execution-controls .step-counter{grid-column:1;grid-row:2;min-width:0}
  .execution-controls button[data-action=reset]{grid-column:2;grid-row:2;height:36px}
}
.legacy-code-wrapper,.legacy-flowchart{container-type:inline-size}

.concept-player .step-insight{border-radius:0}
@media(max-width:650px){.concept-player .execution-controls{border-radius:0 0 13px 13px}}