/* MatriX IDE — desktop clone theme (#1e1e1e / teal) */
.matrix-ide{
  --mx-bg:#1e1e1e;--mx-panel:#252526;--mx-toolbar:#2a2a2a;--mx-border:#3c3c3c;
  --mx-fg:#d4d4d4;--mx-dim:#808080;--mx-accent:#00d4c8;--mx-accent-dim:#008b84;
  --mx-error:#f44747;--mx-num:#b5cea8;--mx-editor:#1e1e1e;--mx-linenum:#2d2d2d;
  display:flex;flex-direction:column;height:100%;min-height:0;background:var(--mx-bg);color:var(--mx-fg);
  font:500 13px/1.4 Inter,Segoe UI,system-ui,sans-serif;
}
.matrix-ide__toolbar{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  min-height:40px;padding:4px 10px;background:var(--mx-toolbar);border-bottom:1px solid var(--mx-border);flex:0 0 auto;
}
.matrix-ide__tools{display:flex;flex-wrap:wrap;gap:6px}
.matrix-ide__btn{
  min-height:28px;padding:0 12px;border:0;border-radius:4px;background:var(--mx-panel);color:var(--mx-accent);
  font:600 .82rem/1 Inter,Segoe UI,sans-serif;cursor:pointer;
}
.matrix-ide__btn:hover{background:var(--mx-accent-dim);color:#000}
.matrix-ide__btn.is-run{background:var(--mx-accent-dim);color:#000}
.matrix-ide__btn.is-tiny{min-height:26px;padding:0 10px}
.matrix-ide__btn:disabled{opacity:.55;cursor:wait}
.matrix-ide__brand{color:var(--mx-dim);font:600 .78rem/1 Inter,sans-serif;white-space:nowrap}
.matrix-ide__brand strong{color:var(--mx-accent);font-weight:700}

.matrix-ide__body{
  display:grid;grid-template-columns:minmax(0,1.35fr) minmax(260px,0.75fr);
  flex:1 1 auto;min-height:0;height:100%;
}
@media(max-width:820px){
  .matrix-ide__body{grid-template-columns:1fr;grid-template-rows:minmax(280px,1fr) minmax(220px,0.7fr)}
}
/* Harness embed: prefer side-by-side so chat-mode host width does not stack the IDE. */
.matrix-embed .matrix-ide__body{
  grid-template-columns:minmax(0,1.35fr) minmax(240px,0.75fr);
  grid-template-rows:none;
}
@media(max-width:560px){
  .matrix-embed .matrix-ide__body{grid-template-columns:1fr;grid-template-rows:minmax(280px,1fr) minmax(220px,0.7fr)}
}

.matrix-ide__left{
  display:grid;grid-template-rows:minmax(0,1.4fr) minmax(140px,0.75fr);min-height:0;border-right:1px solid var(--mx-border);
}
.matrix-ide__editor-wrap{
  display:grid;grid-template-columns:48px minmax(0,1fr);min-height:0;background:var(--mx-editor);border-bottom:1px solid var(--mx-border);
}
.matrix-ide__lines{
  margin:0;padding:12px 8px;overflow:hidden;background:var(--mx-linenum);color:var(--mx-dim);
  font:500 13px/1.5 "IBM Plex Mono",Consolas,monospace;text-align:right;user-select:none;border-right:1px solid var(--mx-border);
}
.matrix-ide__editor{
  margin:0;padding:12px 14px;border:0;resize:none;outline:none;background:var(--mx-editor);color:var(--mx-fg);
  font:500 13px/1.5 "IBM Plex Mono",Consolas,monospace;caret-color:#aeafad;tab-size:4;white-space:pre;overflow:auto;
}
.matrix-ide__console{
  display:grid;grid-template-rows:minmax(0,1fr) auto;min-height:0;background:#121212;
}
.matrix-ide__console-out{
  margin:0;padding:10px 12px;overflow:auto;color:var(--mx-fg);
  font:500 12.5px/1.45 "IBM Plex Mono",Consolas,monospace;white-space:pre-wrap;
}
.matrix-ide__console-out .is-error{color:var(--mx-error)}
.matrix-ide__console-out .is-info{color:var(--mx-dim)}
.matrix-ide__console-out .is-cmd{color:var(--mx-accent)}
.matrix-ide__console-row{
  display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:8px;align-items:center;
  padding:8px 10px;border-top:1px solid var(--mx-border);background:var(--mx-panel);
}
.matrix-ide__prompt{color:var(--mx-accent);font:700 12px/1 "IBM Plex Mono",monospace}
.matrix-ide__console-in{
  min-height:28px;padding:0 10px;border:1px solid var(--mx-border);border-radius:4px;
  background:var(--mx-editor);color:var(--mx-fg);font:500 12.5px/1 "IBM Plex Mono",Consolas,monospace;outline:none;
}
.matrix-ide__console-in:focus{border-color:var(--mx-accent)}

.matrix-ide__right{display:grid;grid-template-rows:auto minmax(0,1fr);min-height:0;background:var(--mx-panel)}
.matrix-ide__tabs{display:flex;gap:2px;padding:4px;background:var(--mx-toolbar);border-bottom:1px solid var(--mx-border);overflow-x:auto}
.matrix-ide__tab{
  min-height:28px;padding:0 12px;border:0;border-radius:4px;background:transparent;color:var(--mx-dim);
  font:600 .8rem/1 Inter,sans-serif;cursor:pointer;
}
.matrix-ide__tab.is-active{background:var(--mx-panel);color:var(--mx-accent)}
.matrix-ide__tab-content{min-height:0;overflow:auto}
.matrix-ide__workspace,.matrix-ide__plot,.matrix-ide__control,.matrix-ide__agent{height:100%;min-height:0;padding:8px}
.matrix-ide__workspace[hidden],.matrix-ide__plot[hidden],.matrix-ide__control[hidden],.matrix-ide__agent[hidden],.matrix-ide__help[hidden]{display:none !important}
.matrix-ide__hint{margin:0 0 8px;color:var(--mx-dim);font:500 .75rem/1.3 Inter,sans-serif}
.matrix-ide__ws-empty{color:var(--mx-dim);padding:12px;font:500 .8rem/1.4 Inter,sans-serif}
.matrix-ide__ws-table{display:grid;gap:2px}
.matrix-ide__ws-row{
  display:grid;grid-template-columns:minmax(64px,.7fr) minmax(48px,.5fr) minmax(0,1.4fr);
  gap:8px;padding:6px 8px;border-radius:4px;background:#1a1a1a;
  font:500 11.5px/1.35 "IBM Plex Mono",Consolas,monospace;color:var(--mx-fg);
}
.matrix-ide__ws-row.is-head{background:transparent;color:var(--mx-dim);font-weight:700}
.matrix-ide__ws-row span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.matrix-ide__plot{display:grid;place-items:stretch;padding:8px}
.matrix-ide__plot-canvas{
  width:100%;height:100%;min-height:220px;border:1px solid var(--mx-border);border-radius:6px;background:#1e1e1e;
}

.matrix-ide__agent{display:grid;grid-template-rows:auto auto minmax(0,1fr) auto auto;gap:8px;height:100%}
.matrix-ide__agent-banner{
  padding:8px 10px;border-radius:4px;background:#3a2a00;color:#ffd866;font:500 .75rem/1.35 Inter,sans-serif;
}
.matrix-ide__agent-chat{
  overflow:auto;padding:8px;border:1px solid var(--mx-border);border-radius:6px;background:#121212;
  font:500 12px/1.45 "IBM Plex Mono",Consolas,monospace;
}
.matrix-ide__agent-chat .is-user{color:var(--mx-accent);margin:0 0 6px}
.matrix-ide__agent-chat .is-agent{color:var(--mx-fg);margin:0 0 6px}
.matrix-ide__agent-chat .is-sys{color:var(--mx-dim);margin:0 0 6px}
.matrix-ide__agent-chat .is-error{color:var(--mx-error);margin:0 0 6px}
.matrix-ide__agent-chat .is-code{
  margin:0 0 8px;padding:8px;border-radius:4px;background:#1a1a1a;color:var(--mx-num);white-space:pre-wrap;overflow:auto;
}
.matrix-ide__agent-btns{display:flex;flex-wrap:wrap;gap:6px}
.matrix-ide__agent-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px}
.matrix-ide__agent-in{
  min-height:30px;padding:0 10px;border:1px solid var(--mx-border);border-radius:4px;
  background:var(--mx-editor);color:var(--mx-fg);font:500 12px/1 "IBM Plex Mono",Consolas,monospace;outline:none;
}

/* Control System Designer */
.matrix-ide__control{
  display:grid;grid-template-rows:auto auto auto auto auto minmax(220px,1fr) auto;
  gap:10px;overflow:auto;background:var(--mx-panel);
}
.matrix-ide__control[hidden]{display:none !important}
.matrix-ide__control-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.matrix-ide__control-head h3{margin:0 0 3px;color:var(--mx-fg);font:700 1rem/1.2 Inter,sans-serif}
.matrix-ide__control-head p{margin:0;color:var(--mx-dim);font:500 .72rem/1.35 Inter,sans-serif}
.matrix-ide__control-badge{
  flex:0 0 auto;padding:5px 8px;border:1px solid rgba(0,212,200,.35);border-radius:999px;
  color:var(--mx-accent);background:rgba(0,212,200,.08);font:700 .65rem/1 Inter,sans-serif;
}
.matrix-ide__control-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.matrix-ide__control-field{display:grid;gap:4px;color:var(--mx-dim);font:600 .68rem/1.2 Inter,sans-serif}
.matrix-ide__control-field:nth-child(n+3){grid-template-columns:56px minmax(0,1fr);align-items:center}
.matrix-ide__control-field small{color:#666;font:500 .62rem/1.2 Inter,sans-serif}
.matrix-ide__control-input{
  width:100%;min-width:0;min-height:30px;box-sizing:border-box;padding:0 9px;border:1px solid var(--mx-border);
  border-radius:4px;outline:none;background:var(--mx-editor);color:var(--mx-fg);
  font:500 11.5px/1 "IBM Plex Mono",Consolas,monospace;
}
.matrix-ide__control-input:focus{border-color:var(--mx-accent)}
.matrix-ide__control-actions{display:flex;flex-wrap:wrap;gap:6px}
.matrix-ide__control-status{
  min-height:18px;padding:6px 8px;border-left:3px solid var(--mx-accent);background:#1a1a1a;
  color:var(--mx-fg);font:600 .7rem/1.35 "IBM Plex Mono",Consolas,monospace;
}
.matrix-ide__control-status.is-stable{border-left-color:#4ec9b0}.matrix-ide__control-status.is-marginal{border-left-color:#dcdcaa}
.matrix-ide__control-status.is-unstable,.matrix-ide__control-status.is-error{border-left-color:var(--mx-error);color:#ff9b9b}
.matrix-ide__control-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px}
.matrix-ide__control-metric{display:grid;gap:2px;padding:7px 8px;border-radius:4px;background:#1a1a1a;min-width:0}
.matrix-ide__control-metric span{color:var(--mx-dim);font:600 .62rem/1.1 Inter,sans-serif;text-transform:uppercase;letter-spacing:.05em}
.matrix-ide__control-metric strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--mx-fg);font:600 .7rem/1.35 "IBM Plex Mono",Consolas,monospace}
.matrix-ide__control-canvas{display:block;width:100%;height:100%;min-height:260px;border:1px solid var(--mx-border);border-radius:6px;background:#1e1e1e}
.matrix-ide__control-note{margin:0;color:var(--mx-dim);font:500 .65rem/1.35 Inter,sans-serif}
@media(max-width:560px){
  .matrix-ide__control-grid,.matrix-ide__control-metrics{grid-template-columns:1fr}
  .matrix-ide__control-head{display:grid}.matrix-ide__control-badge{justify-self:start}
}

.matrix-ide__cli-panel{
  flex:0 0 auto;padding:12px 14px;border-top:1px solid var(--mx-border);background:#031416;color:#99f6e4;
}
.matrix-ide__cli-panel h3{margin:0 0 6px;color:#ecfeff;font:700 .95rem/1.2 Inter,sans-serif}
.matrix-ide__cli-panel pre{
  margin:0 0 8px;padding:10px 12px;border-radius:8px;background:#021012;border:1px solid rgba(45,212,191,.22);
  color:#5eead4;font:600 .8rem/1.45 "IBM Plex Mono",monospace;white-space:pre-wrap;
}
.matrix-ide__cli-panel p{margin:0;font:500 .8rem/1.4 Inter,sans-serif}

/* Page chrome around IDE */
.matrix-page-ide{--mx:#14b8a6;background:#071012;color:#ecfeff;min-height:100vh}
.matrix-page-ide .app-bar{position:relative;background:rgba(7,16,18,.92);border-bottom:1px solid rgba(45,212,191,.2)}
.matrix-page-ide main.matrix-ide-host{
  display:flex;flex-direction:column;gap:0;min-height:calc(100vh - 64px);padding:0;max-width:none;width:100%;
}
.matrix-page-ide #matrixIdeMount{
  flex:1 1 auto;min-height:calc(100vh - 64px);height:calc(100vh - 64px);
}
.matrix-embed .app-bar,.matrix-embed .matrix-nav-hide,.matrix-embed .matrix-chooser{display:none !important}
.matrix-embed body,.matrix-embed{background:#1e1e1e}
.matrix-embed main.matrix-ide-host,.matrix-embed #matrixIdeMount{
  min-height:100vh;height:100vh;max-height:100vh;
}
.matrix-chooser{
  display:grid;gap:14px;max-width:640px;margin:0 auto;padding:28px 18px;
}
.matrix-chooser[hidden]{display:none !important}
.matrix-chooser h1{margin:0;font:700 clamp(1.6rem,3vw,2.2rem)/1.1 "Chakra Petch",sans-serif;color:#f0fdfa}
.matrix-chooser .lede{margin:0;color:#99f6e4;font:500 1rem/1.5 Inter,sans-serif}
.matrix-chooser__choices{display:grid;gap:10px}
.matrix-chooser__choice{
  display:grid;gap:4px;padding:16px;border:1px solid rgba(45,212,191,.28);border-radius:14px;
  background:rgba(15,118,110,.18);color:inherit;text-align:left;cursor:pointer;
}
.matrix-chooser__choice:hover{border-color:#2dd4bf;background:rgba(20,184,166,.22)}
.matrix-chooser__choice strong{font:700 1rem/1.2 Inter,sans-serif}
.matrix-chooser__choice span{color:#99f6e4;font:500 .85rem/1.4 Inter,sans-serif}

/* Autocomplete popup */
.matrix-ide{position:relative}
.matrix-ide__ac{
  position:absolute;z-index:40;min-width:220px;max-width:360px;max-height:220px;overflow:auto;
  margin:0;padding:4px;border:1px solid var(--mx-border);border-radius:6px;
  background:#1a1a1a;box-shadow:0 8px 24px rgba(0,0,0,.45);
  font:500 12px/1.35 "IBM Plex Mono",Consolas,monospace;color:var(--mx-fg);
}
.matrix-ide__ac[hidden],.matrix-ide__ac-detail[hidden]{display:none !important}
.matrix-ide__ac-item{
  display:grid;grid-template-columns:minmax(72px,.7fr) minmax(0,1.3fr);gap:8px;
  padding:6px 8px;border-radius:4px;cursor:pointer;
}
.matrix-ide__ac-item:hover,.matrix-ide__ac-item.is-active{background:rgba(0,212,200,.14);color:var(--mx-accent)}
.matrix-ide__ac-name{font-weight:700;color:var(--mx-accent)}
.matrix-ide__ac-sig{color:var(--mx-dim);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.matrix-ide__ac-detail{
  position:absolute;z-index:41;left:8px;right:8px;bottom:8px;padding:6px 10px;
  border:1px solid var(--mx-border);border-radius:4px;background:#121212;color:var(--mx-dim);
  font:500 11.5px/1.35 Inter,sans-serif;pointer-events:none;
}

/* Syntax Help tab */
.matrix-ide__help{display:grid;grid-template-rows:auto auto minmax(0,1fr);gap:8px;height:100%;min-height:0;padding:8px}
.matrix-ide__help-search{
  min-height:30px;padding:0 10px;border:1px solid var(--mx-border);border-radius:4px;
  background:var(--mx-editor);color:var(--mx-fg);font:500 12px/1 "IBM Plex Mono",Consolas,monospace;outline:none;
}
.matrix-ide__help-search:focus{border-color:var(--mx-accent)}
.matrix-ide__help-body{overflow:auto;min-height:0}
.matrix-ide__help-section{margin:0 0 12px}
.matrix-ide__help-section h4{
  margin:0 0 6px;color:var(--mx-accent);font:700 .72rem/1 Inter,sans-serif;
  letter-spacing:.08em;text-transform:uppercase;
}
.matrix-ide__help-pre{
  margin:0;padding:10px;border-radius:6px;background:#121212;border:1px solid var(--mx-border);
  color:var(--mx-num);font:500 11.5px/1.45 "IBM Plex Mono",Consolas,monospace;white-space:pre-wrap;
}
.matrix-ide__help-row{
  display:grid;gap:2px;padding:8px;margin:0 0 4px;border-radius:4px;background:#1a1a1a;
  border:1px solid transparent;
}
.matrix-ide__help-row:hover{border-color:rgba(0,212,200,.28)}
.matrix-ide__help-sig{color:var(--mx-accent);font:600 11.5px/1.35 "IBM Plex Mono",Consolas,monospace}
.matrix-ide__help-doc{color:var(--mx-fg);font:500 11.5px/1.35 Inter,sans-serif}
.matrix-ide__help-ex{color:var(--mx-dim);font:500 11px/1.35 "IBM Plex Mono",Consolas,monospace}

.matrix-ide__ghost{
  position:absolute;z-index:35;pointer-events:none;color:var(--mx-dim);
  font:500 11px/1 "IBM Plex Mono",Consolas,monospace;opacity:.75;white-space:nowrap;
}
.matrix-ide__ghost[hidden]{display:none !important}

/* Engineering workbenches share the existing MatriX palette. */
.matrix-tools { padding: 16px; overflow: auto; color: #cbd5e1; }
.matrix-tools h3 { color: #f1f5f9; margin: 0 0 8px; }
.matrix-tools p { font-size: 12px; line-height: 1.6; }
.matrix-tools label { display: inline-flex; flex-direction: column; gap: 5px; margin: 6px; font-size: 12px; }
.matrix-tools input, .matrix-tools select, .matrix-tools textarea { color: #e2e8f0; background: #101820; border: 1px solid #334155; border-radius: 5px; padding: 7px; min-width: 0; }
.matrix-tools button { margin: 5px; color: #e2e8f0; background: #1e293b; border: 1px solid #475569; border-radius: 5px; padding: 8px 11px; cursor: pointer; }
.matrix-tools button:hover { border-color: #2dd4bf; }
.matrix-tools button:disabled { opacity: .5; cursor: default; }
.matrix-tools textarea { display: block; width: 100%; box-sizing: border-box; font: 12px/1.5 monospace; margin: 10px 0; }
.matrix-tools canvas { width: 100%; height: auto; display: block; background: #121820; border: 1px solid #334155; }
.matrix-tools pre { white-space: pre-wrap; overflow-wrap: anywhere; max-height: 240px; overflow: auto; font-size: 11px; }
.matrix-tools__blocks { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 8px; margin: 12px 0; }
.matrix-tools__block { padding: 10px; border: 1px solid #334155; border-top: 2px solid #2dd4bf; border-radius: 7px; background: #151d27; }
.matrix-tools__block strong { display: block; font-size: 12px; overflow-wrap: anywhere; }
.matrix-tools__block label { display: flex; }
