/* vibe-coding 课专用扩展（叠在 MixCO common/course.css 上） */
:root {
  --brand: var(--teal, #0f766e);
  --accent: var(--amber, #c47b2d);
  --line: var(--line, #c9d9d1);
}
.head-desc {
  margin: 6px 0 0;
  color: var(--muted);
  font-size: 0.95rem;
  line-height: 1.55;
}
.scene-lead {
  margin: 0 0 16px;
  padding: 12px 14px;
  border-radius: 12px;
  background: #f7fbf9;
  border: 1px solid #d5e6de;
}
.scene-lead p { margin: 0.35em 0; }
.scene-lead p:first-child { margin-top: 0; }
.scene-lead p:last-child { margin-bottom: 0; }
.cover-meta { color: var(--muted); font-size: 0.9rem; }
.net-concept, .concept-box {
  margin: 14px 0; padding: 12px 14px; border-radius: 12px;
  background: #fff8f2; border: 1px solid #f0d7c4; color: #5c3317;
}
.think-q {
  margin: 14px 0; padding: 12px 14px; border-left: 3px solid var(--accent);
  background: #fffaf6; color: #6a3b16; border-radius: 0 12px 12px 0;
}
.workshop {
  margin: 16px 0; padding: 14px 16px 6px; border-radius: 14px;
  background: #f7fbf9; border: 1px solid #d5e6de;
}
.workshop-title { font-weight: 700; color: var(--brand); margin: 0 0 8px; }
.step-list {
  margin: 4px 0 8px;
  padding-left: 1.35em;
}
.step-list > li {
  margin: 0 0 10px;
  padding: 0 0 10px;
  border-bottom: 1px solid #e3eee8;
}
.step-list > li:last-child { margin-bottom: 0; padding-bottom: 2px; border-bottom: 0; }
.step-list > li > p { margin: 0.15em 0; }
.step-expect, .step-stuck {
  margin-top: 4px;
  font-size: 0.92rem;
  color: #4f635c;
  line-height: 1.55;
}
.step-expect span, .step-stuck span {
  margin-right: 6px;
  font-size: 12px;
  font-weight: 700;
  color: #0b6e4f;
}
.step-stuck span { color: #c47b2d; }
.footer-note { color: var(--muted); font-size: 12px; margin-top: 16px; }
.study-meta { display: flex; flex-wrap: wrap; gap: 8px; margin: 2px 0 16px; }
.study-pill {
  background: #fff; color: #3d5c52; border: 1px solid #d5e3dc; border-radius: 999px;
  padding: 4px 12px; font-size: 13px; font-weight: 600;
}
.study-pill:first-child {
  background: #e7f3ee; color: #0b6e4f; border-color: transparent; font-weight: 700;
}
.code-sample {
  background: #10241e; color: #e7f6ef; padding: 14px 16px; border-radius: 12px;
  overflow: auto; font-family: Consolas, "Sarasa Mono SC", monospace;
  font-size: 13px; line-height: 1.6; white-space: pre-wrap;
  margin: 12px 0 14px;
}
.do-card {
  border: 1px solid #e3eee8; border-radius: 12px; padding: 12px 14px;
  margin: 10px 0; background: #fff;
}
.do-card .k { display: block; font-size: 12px; color: var(--muted); font-weight: 700; margin-top: 6px; }
.do-card .k:first-child { margin-top: 0; }
.pitfall {
  background: #fff6f4; border-left: 3px solid var(--accent);
  padding: 8px 12px; margin: 8px 0; border-radius: 8px;
}
.check-pass { background: #f3faf7; border-radius: 12px; padding: 12px 14px; }
.showcase {
  margin: 0 0 16px; padding: 14px 16px; border-radius: 12px;
  background: #10241e; color: #e7f6ef;
}
.showcase .workshop-title { color: #8ddec0; margin: 0 0 6px; }
.showcase p { margin: 6px 0; }
.showcase code { color: #fff; background: rgba(255,255,255,.08); padding: 1px 6px; border-radius: 6px; }

.cover-inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr); /* 禁止按大图 intrinsic 撑开列宽 */
  gap: 12px;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
}
.cover-hero {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0;
  border-radius: 12px;
  overflow: hidden;
  background: transparent;
  border: 0;
  min-height: 0;
}
.cover-hero img {
  display: block;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  /* 高:宽 = 1:3（宽度是高度的 3 倍） */
  height: auto !important;
  max-height: none !important;
  aspect-ratio: 3 / 1;
  margin: 0 auto;
  object-fit: cover;
  object-position: center;
  border-radius: 12px;
  background: transparent;
}
.lesson-hero {
  width: 100%; max-width: none;
  margin: 0;
  border-radius: 0; overflow: visible;
  border: 0; border-bottom: 1px solid var(--line); background: #f7fbf8;
}
.lesson-hero img {
  display: block; width: 100%; max-width: none; height: auto; max-height: none;
  /* 完整显示概念图，高度随 SVG 变化，不裁切 */
  aspect-ratio: auto;
  object-fit: contain; object-position: center top; background: #f7fbf8;
}
.lesson-hero figcaption { display: none; }
.inline-fig {
  width: fit-content; max-width: 100%;
  margin: 14px auto 16px; border: 1px solid var(--line); border-radius: 14px;
  overflow: hidden; background: #f4faf7;
}
.inline-fig img {
  display: block; width: auto; max-width: 560px; height: auto; max-height: 168px;
  margin: 0 auto; object-fit: contain;
}
.inline-fig figcaption {
  padding: 6px 12px 8px; font-size: 13px; color: #0b4f49; font-weight: 700;
  border-top: 0; background: transparent; text-align: center;
}
.unit-hero {
  width: 100%; max-width: none;
  margin: 0;
}
.unit-hero img {
  width: 100%; max-height: none; height: auto; background: #fff6e8;
  /* 原 800×225，高度统一为 3/4（≈169） */
  aspect-ratio: 800 / 169;
  object-fit: cover; object-position: center;
}
.unit-lessons {
  list-style: none; padding: 0; margin: 12px 0 0;
  display: grid; gap: 10px;
}
.unit-lessons a {
  display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 12px; align-items: center;
  padding: 12px 14px; border: 1px solid var(--line); border-radius: 12px;
  background: linear-gradient(180deg, #f7fbf8, #fff); color: inherit; font-weight: 600;
}
.unit-lessons a:hover { background: #f3faf7; text-decoration: none; }
.unit-lesson-n { color: #0b6e4f; font-size: 14px; }
/* 封面单元卡：仅单元标题，强制单行（与 MixCO 其它课 cover-points 一致） */
html[data-course-id="lesson130"] .cover-points li,
html[data-course-id="lesson130"] .cover-points a.cover-point-link {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
html[data-course-id="lesson130"] .cover-points a.cover-point-link {
  display: block;
  color: inherit;
  text-decoration: none;
  font-weight: inherit;
}
.cover-meta { color: var(--muted); font-size: 14px; }
html[data-course-id="lesson130"] .nav-l1-label,
html[data-course-id="lesson130"] .nav a.nav-l1 {
  white-space: nowrap !important;
  overflow: hidden;
  text-overflow: ellipsis;
}

.quiz { margin-top: 18px; padding-top: 8px; border-top: 1px solid var(--line); }
.quiz-opts { display: grid; gap: 6px; margin: 8px 0 12px; }
.quiz-opt {
  display: flex; gap: 8px; align-items: flex-start;
  padding: 8px 10px; border: 1px solid var(--line); border-radius: 10px; cursor: pointer;
}
.quiz-actions { margin-top: 8px; }
.quiz-check {
  border: 0; background: var(--brand); color: #fff; border-radius: 10px;
  padding: 8px 14px; cursor: pointer; font: inherit;
}
.quiz-result { margin-top: 8px; font-weight: 600; }
.quiz-result.ok { color: var(--brand); }
.quiz-result.bad { color: #a33; }
.quiz-mark { margin-left: 6px; }

.sidebar-backdrop {
  display: none; position: fixed; inset: 0; z-index: 20;
  border: 0; padding: 0; margin: 0; background: rgba(15,40,34,.4); cursor: pointer;
}
.vc-stage {
  margin: 8px 0 4px; padding: 12px; border-radius: 14px;
  background: #f7faf8; border: 1px solid var(--line);
}
.vc-say {
  min-height: 3.2em; margin: 10px 0 0; padding: 10px 12px;
  background: #fff; border-left: 3px solid var(--brand); border-radius: 8px;
}
.vc-row { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; }
.vc-btn {
  border: 1px solid #b9d5ca; background: #fff; color: var(--ink);
  border-radius: 999px; padding: 6px 12px; cursor: pointer; font: inherit;
}
.vc-btn.is-on, .vc-btn:hover { background: var(--brand); color: #fff; border-color: var(--brand); }
.vc-board { display: flex; gap: 12px; align-items: stretch; flex-wrap: wrap; }
.vc-card {
  flex: 1 1 180px; background: #fff; border: 1px solid var(--line);
  border-radius: 12px; padding: 12px; min-height: 96px;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.vc-card.is-on { border-color: var(--brand); box-shadow: 0 8px 18px rgba(11,110,79,.12); transform: translateY(-2px); }
.vc-card h4 { margin: 0 0 6px; font-size: 15px; }
/* 封面五步卡：文案缩短后仍强制单行 */
.vc-stage[data-vc="0"] .vc-board { flex-wrap: nowrap; gap: 8px; }
.vc-stage[data-vc="0"] .vc-card {
  flex: 1 1 0; min-width: 0; min-height: 0; padding: 10px 8px;
}
.vc-stage[data-vc="0"] .vc-card h4,
.vc-stage[data-vc="0"] .vc-card p {
  margin: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.vc-stage[data-vc="0"] .vc-card h4 { margin-bottom: 6px; }
.vc-stage[data-vc="0"] .vc-card p {
  font-size: clamp(0.72rem, 0.65rem + 0.35vw, 0.88rem);
  line-height: 1.35;
}
.vc-mini {
  background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 14px;
  max-width: 420px;
}
.vc-mini button.demo, .vc-demo-btn {
  margin-top: 8px; background: #0b6e4f; color: #fff; border: 0; border-radius: 10px;
  padding: 8px 14px; cursor: pointer; font: inherit;
}
.vc-hit { outline: 3px solid #e8b86d; transition: outline-color .2s; }
.lane { display: grid; grid-template-columns: 120px 1fr 120px; gap: 8px; align-items: center; margin: 8px 0; }
.lane .node { background: #fff; border: 1px solid var(--line); border-radius: 10px; text-align: center; padding: 10px 6px; }
.track { position: relative; height: 28px; background: #e7f3ee; border-radius: 999px; }
.ball {
  position: absolute; top: 4px; left: 4px; width: 20px; height: 20px; border-radius: 50%;
  background: #c45c26; transition: left .7s ease;
}
.ball.go { left: calc(100% - 24px); }
.vc-json {
  font-family: Consolas, monospace; font-size: 13px; background: #10241e; color: #e7f6ef;
  border-radius: 10px; padding: 10px 12px; white-space: pre-wrap; min-height: 4.5em;
}
.vc-table { width: 100%; border-collapse: collapse; background: #fff; }
.vc-table th, .vc-table td { border: 1px solid var(--line); padding: 6px 8px; text-align: left; }
.vc-table tr.is-on td { background: #e7f6ef; }
@keyframes vc-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.vc-in { animation: vc-in .35s ease; }
@keyframes vc-shake {
  0%, 100% { transform: translateX(0); }
  25% { transform: translateX(-4px); }
  75% { transform: translateX(4px); }
}
.vc-shake { animation: vc-shake .35s ease; }
@media (prefers-reduced-motion: reduce) {
  .ball, .vc-card, .vc-in, .vc-shake, .llm-bot.is-wait::after { transition: none; animation: none; }
}

.vibe-ide-slot { margin-top: 10px; }
.vibe-ide-slot .ide {
  --c-bg: #181818;
  --c-side: #141414;
  --c-fg: #f0f0f0;
  --c-dim: #f0f0f0bd;
  --c-mute: #f0f0f05c;
  --c-ph: #f0f0f099;
  --c-line: #f0f0f013;
  --c-hover: #f0f0f011;
  --c-on: #f0f0f01e;
  --c-input: #f0f0f00a;
  --c-btn: #81a1c1;
  --c-btn-fg: #191c22;
  --c-btn-hover: #87a6c4;
  --c-btn2: #626262;
  --c-danger: #e34671;
  --ui: "Segoe WPC", "Segoe UI", system-ui, "Microsoft YaHei", sans-serif;
  --code: Consolas, "Courier New", monospace;
  --ui-size: 11px;
  --code-size: 13px;
  --code-line: 18px;
  position: relative;
  height: min(82vh, 860px);
  min-height: 560px;
  border-radius: 10px;
  overflow: hidden;
  border: 1px solid #2a2a2a;
  display: flex; flex-direction: column;
  background: var(--c-bg); color: var(--c-fg);
  font-family: var(--ui); font-size: var(--ui-size); line-height: 1.35;
}
.vibe-ide-slot .ide.is-max {
  position: fixed; inset: 0; z-index: 80;
  width: auto; height: auto; min-height: 0;
  border-radius: 0; border: 0;
}
body.ide-maxed { overflow: hidden; }
.ide[hidden] { display: none !important; }
.ide-max {
  margin-left: auto; flex: 0 0 auto;
  border: 0; border-radius: 4px; padding: 2px 8px; cursor: pointer;
  font: inherit; font-size: 11px; font-weight: 500;
  background: var(--c-btn2); color: var(--c-fg);
}
.ide-max:hover { background: #818181; }
.ide-chat-title { display: flex; align-items: center; gap: 8px; }
.ide-tabs-grow { flex: 1 1 auto; min-width: 8px; }
.ide .llm-status {
  margin: 6px 0 0; font-size: var(--ui-size); line-height: 1.35; color: var(--c-ph);
}
.ide-close, .llm-load, .llm-compose button {
  border: 0; border-radius: 4px; padding: 4px 10px; cursor: pointer; font: inherit;
  background: var(--c-btn); color: var(--c-btn-fg);
}
.ide-close:hover, .llm-load:hover, .llm-compose button:hover { background: var(--c-btn-hover); }
.ide-close { background: var(--c-btn2); color: var(--c-fg); }
.ide-close:hover { background: #818181; }
.llm-load:disabled, .llm-compose button:disabled { opacity: .55; cursor: default; }
.llm-compose button:disabled:hover, .llm-load:disabled:hover { background: var(--c-btn); }
.ide-body {
  flex: 1; min-height: 0;
  display: grid;
  grid-template-columns: var(--ide-files, 210px) 5px minmax(120px, 1fr) 5px var(--ide-chat, 360px);
}
.ide-split {
  z-index: 3; padding: 0; border: 0; margin: 0;
  background: var(--c-line); position: relative;
}
.ide-split::after {
  content: ''; position: absolute; inset: 0;
}
.ide-split-v { cursor: col-resize; }
.ide-split-v::after { left: -3px; right: -3px; }
.ide-split-h { cursor: row-resize; min-height: 5px; }
.ide-split-h::after { top: -3px; bottom: -3px; }
.ide-split:hover,
.ide-body.is-resizing .ide-split:hover,
.ide-chat-split.is-resizing .ide-split-h {
  background: var(--c-btn);
}
.ide-body.is-resizing,
.ide-chat-split.is-resizing { cursor: col-resize; user-select: none; }
.ide-chat-split.is-resizing { cursor: row-resize; }
.ide-body.is-resizing #ide-frame { pointer-events: none; }
.ide-mode { padding: 8px 12px 0; }
.ide-config { margin: 4px 10px 0; color: var(--c-dim); font-size: var(--ui-size); }
.ide-config summary { cursor: pointer; font-weight: 600; }
.ide-config label { display: grid; gap: 2px; margin-top: 6px; }
.ide-config [hidden] { display: none !important; }
.ide-config input, .ide-config select {
  width: 100%; font: inherit; color: var(--c-fg); background: var(--c-input);
  border: 1px solid var(--c-line); border-radius: 4px; padding: 4px 6px;
  color-scheme: dark;
}
/* Windows 原生下拉 option 常是白底；强制深色字，避免继承 IDE 浅色字看不清 */
.ide-config select option,
.ide-config select optgroup {
  color: #1a1a1a;
  background: #ffffff;
}
.ide-config input::placeholder { color: var(--c-ph); }
.ide-config-row { margin-top: 6px; display: flex; flex-wrap: wrap; gap: 6px; }
.ide-config-row button {
  border: 0; background: var(--c-btn); color: var(--c-btn-fg);
  border-radius: 4px; padding: 4px 8px; font: inherit; font-size: var(--ui-size); cursor: pointer;
}
.ide-config-row button:hover { background: var(--c-btn-hover); }
.ide-key-note { margin: 4px 0 0; color: var(--c-ph); font-size: var(--ui-size); }
.ide-files, .ide-chat { background: var(--c-side); min-height: 0; display: flex; flex-direction: column; min-width: 0; }
.ide-main { min-width: 0; min-height: 0; display: flex; flex-direction: column; background: var(--c-bg); }
.ide-tabs {
  flex: 0 0 auto; display: flex; align-items: stretch; gap: 0;
  flex-wrap: nowrap; min-width: 0;
  background: var(--c-side); border-bottom: 1px solid var(--c-line);
}
.ide-tab {
  border: 0; border-bottom: 1px solid transparent; background: var(--c-side);
  color: var(--c-mute); font: inherit; font-size: var(--ui-size); font-weight: 400;
  padding: 6px 12px; cursor: pointer;
  flex: 0 0 auto;
  white-space: nowrap;
  writing-mode: horizontal-tb;
  word-break: keep-all;
}
.ide-tab:hover { color: var(--c-dim); }
.ide-tab.is-on { color: var(--c-fg); border-bottom-color: var(--c-line); background: var(--c-bg); }
.ide-tab-file {
  align-self: center; padding: 0 10px;
  color: var(--c-ph); font-size: var(--ui-size); font-family: var(--code);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 42%;
}
.ide-code, .ide-preview { flex: 1; min-height: 0; min-width: 0; display: flex; flex-direction: column; background: var(--c-bg); }
.ide-preview { background: #fff; position: relative; }
.ide-code[hidden], .ide-preview[hidden] { display: none !important; }
.ide-preview-hint {
  flex: 0 0 auto; margin: 0; padding: 8px 12px;
  background: #fff8e6; color: #6b4e00; border-bottom: 1px solid #f0e0b0;
  font-size: 12px; line-height: 1.4;
}
.ide-preview-hint[hidden] { display: none !important; }
.ide-pane-title {
  flex: 0 0 auto; padding: 6px 10px; font-size: 11px; font-weight: 600;
  letter-spacing: .04em; color: var(--c-mute); border-bottom: 1px solid var(--c-line);
  display: flex; align-items: center; gap: 6px;
}
.ide-file-ops { margin-left: auto; display: inline-flex; gap: 2px; }
.ide-file-ops button {
  border: 0; background: transparent; color: var(--c-mute); cursor: pointer;
  font: inherit; font-size: 11px; font-weight: 500; padding: 2px 5px; border-radius: 3px;
  white-space: nowrap; flex: 0 0 auto;
}
.ide-file-ops button:hover { background: var(--c-hover); color: var(--c-fg); }
#ide-file-list { list-style: none; margin: 0; padding: 4px; overflow: auto; flex: 1; min-height: 0; }
#ide-file-list button {
  width: 100%; text-align: left; border: 0; background: transparent; color: var(--c-dim);
  font: inherit; font-size: var(--ui-size); padding: 3px 6px; border-radius: 3px; cursor: pointer;
}
#ide-file-list button:hover { background: var(--c-hover); color: var(--c-fg); }
#ide-file-list button.is-on { background: var(--c-on); color: var(--c-fg); }
#ide-file-list .ide-folder { display: block; color: var(--c-ph); font-size: 11px; }
.ide-empty { padding: 6px; color: var(--c-ph); font-size: var(--ui-size); line-height: 1.35; }
#ide-code {
  flex: 1; min-height: 0; width: 100%; resize: none; border: 0; outline: none;
  background: var(--c-bg); color: var(--c-fg); padding: 6px 12px; caret-color: var(--c-fg);
  font-family: var(--code); font-size: var(--code-size); line-height: var(--code-line);
  letter-spacing: 0; font-feature-settings: "liga" off, "calt" off; white-space: pre;
}
#ide-frame { flex: 1; min-height: min(72vh, 720px); width: 100%; border: 0; background: #fff; }
.ide .llm-hint {
  margin: 4px 10px 0; padding: 0;
  font-size: var(--ui-size); line-height: 1.35; color: var(--c-dim);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.ide-chat-split {
  flex: 1; min-height: 0;
  display: grid;
  grid-template-rows: minmax(72px, var(--ide-log, 1fr)) 5px minmax(72px, 1fr);
  gap: 0; padding: 6px;
}
.llm-log {
  min-height: 0; height: 100%; overflow: auto; margin: 0;
  padding: 6px 8px; border-radius: 4px; background: var(--c-bg);
  border: 1px solid var(--c-line);
}
.llm-log p { margin: 0 0 6px; white-space: pre-wrap; line-height: 1.35; font-size: var(--ui-size); }
.llm-you { color: var(--c-fg); font-weight: 600; }
.llm-bot { color: var(--c-dim); }
.llm-bot.is-wait { color: var(--c-btn); }
.llm-bot.is-wait::after {
  content: '';
  display: inline-block;
  width: 1.2em;
  text-align: left;
  animation: vibe-wait-dots 1.2s steps(4, end) infinite;
}
@keyframes vibe-wait-dots {
  0% { content: ''; }
  25% { content: '.'; }
  50% { content: '..'; }
  75% { content: '...'; }
}
.llm-compose { min-height: 0; height: 100%; display: flex; flex-direction: column; gap: 6px; padding: 0; }
.llm-compose textarea {
  flex: 1; min-height: 0; width: 100%; resize: none;
  font: inherit; font-size: var(--ui-size); line-height: 1.35;
  color: var(--c-fg); background: var(--c-input);
  border: 1px solid var(--c-line); border-radius: 4px; padding: 6px 8px;
}
.llm-compose textarea::placeholder { color: var(--c-ph); }
.ide-publish { align-self: center; display: flex; gap: 4px; align-items: center; min-width: 0; padding-right: 8px; }
.ide-publish input {
  width: 132px; max-width: 26vw; font: inherit; font-size: var(--ui-size); color: var(--c-fg);
  background: var(--c-input); border: 1px solid var(--c-line); border-radius: 4px; padding: 2px 6px;
}
.ide-publish input::placeholder { color: var(--c-ph); }
.ide-publish button { flex: 0 0 auto; padding: 2px 8px; font-size: var(--ui-size); white-space: nowrap; }
.llm-actions { display: flex; gap: 6px; flex: 0 0 auto; }
.llm-actions button { flex: 1; }
#llm-stop { background: var(--c-danger); color: #fff; }
#llm-stop:hover { background: #fc6b83; }
.vibe-example {
  margin: 12px 0 4px; padding: 12px 14px; border-radius: 14px;
  border: 1px solid #c9d9d1; background: #f7fbf8;
}
.vibe-example-k { margin: 0 0 6px; font-weight: 700; color: #0b6e4f; }
script.vibe-seed, .vibe-seed { display: none !important; }
.vibe-prompt {
  margin: 8px 0; padding: 8px 10px; white-space: pre-wrap;
  font-family: Consolas, "Courier New", monospace; font-size: 11px; line-height: 1.35;
  background: #fff; border-radius: 10px; border: 1px solid #e4efe9;
}
.vibe-use {
  border: 0; border-radius: 10px; padding: 8px 14px; cursor: pointer;
  background: #0b6e4f; color: #fff; font: inherit; font-weight: 700;
}
@media (max-width: 980px) {
  /* 窄屏改纵向堆叠时，给足高度，避免只露出文件栏顶就裁切 */
  .vibe-ide-slot .ide {
    height: auto;
    min-height: 720px;
    max-height: none;
  }
  .ide-body {
    grid-template-columns: 1fr;
    grid-template-rows: 120px minmax(240px, 1fr) minmax(280px, 1fr);
    min-height: 680px;
  }
  .ide-split-v { display: none; }
  .ide-main { min-height: 240px; }
  .ide-chat { min-height: 280px; }
}



.vibe-ide-slot:not(:has(.ide)) {
  min-height: 120px;
  border: 1px dashed #b9d5ca;
  border-radius: 10px;
  background: #f7fbf8;
  display: flex; align-items: center; justify-content: center;
}
.vibe-ide-loading, .vibe-ide-fail {
  margin: 16px; color: #0b4f49; font-size: 14px; font-weight: 600; text-align: center;
}
.vibe-ide-fail { color: #8d2f2f; }