/* ═══════════════════════════════════════════════════
   Живая консоль: редактор с номерами строк + окно сборки.
   Общая для бесплатной главы (kniga.html) и кабинета (app.html) —
   раньше эти правила лежали внутри kniga.html и в кабинете их не было.
   Работает поверх переменных из css/style.css.
   ═══════════════════════════════════════════════════ */

/* ⚠ Полотно консоли тоже одевается обликом земли (переменные с запасом) */
.cons { margin: 1.6em 0 2em; border: 1px solid var(--border-glow); border-radius: var(--radius); overflow: hidden; background: var(--code-bg, rgba(10, 10, 26, 0.92)); }
.cons__bar { display: flex; align-items: center; gap: 7px; padding: 10px 14px; border-bottom: 1px solid var(--border); }
.cons__bar span { width: 10px; height: 10px; border-radius: 50%; background: var(--border-glow); }
.cons__bar span:first-child { background: var(--accent); }
.cons__bar span:nth-child(2) { background: var(--amber); }
.cons__bar span:nth-child(3) { background: var(--green); }
.cons__bar p { margin: 0 0 0 auto; font-size: 11.5px; color: var(--text-dim); }
/* редактор: колонка номеров строк слева + textarea, как в студии */
.cons__editor { display: flex; align-items: stretch; }
.cons__gutter {
  flex: none; padding: 14px 10px 14px 14px; text-align: right;
  font-family: 'JetBrains Mono', monospace; font-size: 14px; line-height: 1.65;
  color: #4B5A7A; user-select: none; border-right: 1px solid rgba(76, 90, 122, 0.25);
  white-space: pre;
}
.cons__gutter i { font-style: normal; display: block; }
.cons__gutter i.bad { color: var(--accent); font-weight: 600; }
/* ── ПОДСВЕТКА СВИТКА ──
   Раскрасить текст внутри textarea браузер не умеет, поэтому под ней лежит
   зеркало (.cons__hl) с тем же текстом, а сама она становится прозрачной —
   видна только каретка. 🔴 Метрики ОБЯЗАНЫ совпадать до пикселя: шрифт,
   размер, межстрочный, отступы, tab-size, white-space. Меняешь одно —
   меняй в обоих правилах, иначе буквы поплывут относительно каретки. */
.cons__paint { position: relative; flex: 1; min-width: 0; }
.cons__hl, .cons__code {
  font-family: 'JetBrains Mono', monospace; font-size: 14px; line-height: 1.65;
  padding: 14px 16px; tab-size: 4; white-space: pre;
  letter-spacing: 0; word-spacing: 0;
}
.cons__hl {
  position: absolute; inset: 0; margin: 0; overflow: hidden;
  pointer-events: none; color: #EAFFF9; background: transparent;
}
/* ⚠ Цвета кода — через переменные с запасным значением: облик земли меняет
   и редактор тоже (кабинет), а бесплатная глава остаётся в базовых цветах. */
.cons__hl i { font-style: normal; }
.cons__hl .t-key  { color: var(--code-key,  #A78BFA); }   /* if, for, new, break… */
.cons__hl .t-type { color: var(--code-type, #22D3EE); }   /* int, string, Random  */
.cons__hl .t-str  { color: var(--code-str,  #FCD34D); }   /* надписи и руны       */
.cons__hl .t-hole { color: var(--code-hole, #34D399); }   /* окошко живой нити    */
.cons__hl .t-num  { color: var(--code-num,  #FDA4AF); }
.cons__hl .t-com  { color: var(--code-com,  #6B7A99); font-style: italic; }
.cons__hl .t-call { color: var(--code-call, #93C5FD); }   /* Console.WriteLine    */
.cons__hl .t-pun  { color: var(--code-pun,  #94A3B8); }
.cons__hl .t-op   { color: var(--code-op,   #E2E8F0); }
.cons__code {
  display: block; width: 100%; border: 0; outline: none; resize: none;
  background: transparent; overflow: hidden;
  color: transparent; caret-color: #EAFFF9;
  min-height: 64px; overflow-x: auto; position: relative;
}
/* текст прозрачен, поэтому выделение показываем цветной полосой */
.cons__code::selection { background: rgba(124, 58, 237, .45); }
.cons__actions { display: flex; align-items: center; gap: 12px; padding: 10px 14px; border-top: 1px dashed var(--border); flex-wrap: wrap; }
.cons__run { padding: 10px 20px; font-size: 13.5px; }
.cons__hint { font-size: 12px; color: var(--text-dim); }
.cons__out {
  margin: 0; padding: 14px 16px; border-top: 1px solid var(--border);
  background: var(--code-out, #05050f); color: var(--code-text, #D8FFEF);
  font-family: 'JetBrains Mono', monospace; font-size: 13.5px; line-height: 1.6;
  /* перенос длинных строк: вывод никогда не уезжает за экран */
  white-space: pre-wrap; overflow-wrap: break-word; word-break: break-word;
  tab-size: 8; min-height: 20px; max-height: 420px; overflow-y: auto;
}
/* окраска частей вывода — как в окне сборки */
.cons__out b { font-weight: 400; display: block; }
.cons__out .c-err  { color: #FF8095; }
.cons__out .c-warn { color: var(--amber); }
.cons__out .c-ok   { color: var(--green); }
.cons__out .c-dim  { color: #6B7A99; }
.cons__out .c-caret { color: var(--accent); }
.cons__out .c-hint { color: var(--cyan); }
.cons__out .c-src  { color: #C9D6EA; }
.cons__out.err { color: #FF8095; }
.cons__status { font-size: 13px; }
.cons__status.ok { color: var(--green); }
.cons__status.bad { color: var(--accent); }
.cons.done { border-color: rgba(52, 211, 153, 0.65); }