/* ═══════════════════════════════════════════════════════════════════════════
   VAIMAN · ИИ-ЧАТЫ НА ТЕЛЕФОНЕ — вид к js/chat-mobile.js (02.10, Вячеслав: «на телефоне чат не доделан,
   читаемость нулевая, ничего не понятно»). Закон EMBER: только токены css/ember-light.css, заголовки —
   Oswald 700 капсом с оранжевой точкой, цифры — Montserrat, текст — Manrope; плашки петроль с медной
   кромкой в обеих темах (токены поверхности переопределены, текст светлый), заливки — оранжевые с
   чёрным текстом. Внутри #cl-wrap размеры — calc(Npx*var(--clz,1)) (масштаб страницы чата),
   окна вне #cl-wrap — calc(Npx*var(--k,1)) (34″). Всё под html.cm — без модуля правил нет.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ═════════ 1 · КНОПКИ ПОД ОТВЕТОМ — одна тихая строка ≈32 px ═════════ */
html.cm body #cl-wrap .cl-msg-body > .cl-acts.cm-acts {
  display: flex !important; flex-wrap: nowrap !important; align-items: center; gap: calc(2px*var(--clz,1)) !important;
  margin: calc(8px*var(--clz,1)) 0 0 calc(-8px*var(--clz,1)) !important; padding: 0 !important; min-height: calc(32px*var(--clz,1));
  max-width: calc(100% + calc(8px*var(--clz,1))); background: none !important; border: 0 !important; box-shadow: none !important;
  border-radius: 0 !important; overflow: visible !important; opacity: 1;
}
html.cm body #cl-wrap .cm-acts .cl-act {
  position: relative; display: inline-flex !important; align-items: center; justify-content: center; gap: calc(6px*var(--clz,1));
  flex: 0 0 auto; height: calc(32px*var(--clz,1)) !important; min-height: calc(32px*var(--clz,1)) !important; min-width: calc(32px*var(--clz,1)) !important;
  padding: 0 calc(7px*var(--clz,1)) !important; margin: 0 !important; border: 0 !important; border-radius: 999px !important;
  background: transparent !important; box-shadow: none !important; color: var(--text-muted) !important;
  font: 600 calc(12.5px*var(--clz,1))/1 var(--font-body) !important; letter-spacing: 0 !important; text-transform: none !important;
  cursor: pointer; transition: color .15s ease, background-color .15s ease; -webkit-tap-highlight-color: transparent;
}
html.cm body #cl-wrap .cm-acts .cl-act .cm-ai { flex: none; width: calc(18px*var(--clz,1)); height: calc(18px*var(--clz,1)); }
html.cm body #cl-wrap .cm-acts .cl-act:hover { color: var(--text-primary) !important; background: var(--hover-tint) !important; }
html.cm body #cl-wrap .cm-acts .cl-act:focus-visible { outline: 2px solid var(--accent-fill); outline-offset: 1px; }
html.cm body #cl-wrap .cm-acts .cl-act.active,
html.cm body #cl-wrap .cm-acts .cl-act.cm-on { color: var(--accent-ember) !important; }
/* палец больше значка: невидимая зона касания 44×40 без сдвига строки */
html.cm body #cl-wrap .cm-acts .cl-act::after { content: ''; position: absolute; left: 50%; top: 50%; width: max(100%, calc(42px*var(--clz,1))); height: calc(40px*var(--clz,1)); transform: translate(-50%, -50%); }
html.cm body #cl-wrap .cm-acts .cl-act > .cm-al { display: none !important; }
@media (min-width: 900px) {
  html.cm body #cl-wrap .cm-acts .cl-act:not(.cl-act-ic) > .cm-al { display: inline !important; }
  html.cm body #cl-wrap .cm-acts .cl-act:not(.cl-act-ic) { padding: 0 calc(10px*var(--clz,1)) 0 calc(8px*var(--clz,1)) !important; }
}
/* «списано …» — мелко справа в той же строке */
html.cm body #cl-wrap .cm-acts .cm-meta { margin: 0 0 0 auto !important; padding: 0 0 0 calc(10px*var(--clz,1)); display: flex; align-items: center; min-width: 0; flex: 0 1 auto; }
html.cm body #cl-wrap .cm-acts .cl-msg-cost {
  font: 400 calc(11.5px*var(--clz,1))/1 var(--font-num) !important; color: var(--text-muted) !important; letter-spacing: 0 !important;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
/* под вопросом — «Изменить / Переотправить» тише и ниже */
html.cm:not(.cv2) #cl-wrap .cl-user-acts { gap: calc(4px*var(--clz,1)); margin-top: calc(4px*var(--clz,1)); }
html.cm:not(.cv2) #cl-wrap .cl-user-acts button { min-height: calc(30px*var(--clz,1)) !important; padding: 0 calc(8px*var(--clz,1)) !important; font-size: calc(12.5px*var(--clz,1)) !important; color: var(--text-muted) !important; border: 0 !important; background: transparent !important; }
/* при нехватке ваймов — кнопка тарифа под сообщением */
html.cm #cl-wrap .cm-low {
  display: inline-flex; align-items: center; gap: calc(8px*var(--clz,1)); margin: calc(10px*var(--clz,1)) 0 0; min-height: calc(40px*var(--clz,1));
  padding: 0 calc(16px*var(--clz,1)); border: 0; border-radius: 999px; background: var(--accent-grad); color: var(--on-accent);
  font: 700 calc(14px*var(--clz,1))/1.1 var(--font-body); cursor: pointer;
}

/* ═════════ 7 · ЧИТАЕМОСТЬ ОТВЕТА — 17 px Manrope, воздух, заголовки Oswald ═════════ */
html.cm:not(.cv2) #cl-wrap .cl-msg.ai .cl-msg-content {
  font-family: var(--font-body); font-size: calc(17px*var(--k,1)); line-height: 1.6; font-weight: 400; color: var(--text-primary);
  letter-spacing: .002em; -webkit-font-smoothing: antialiased;
}
html.cm:not(.cv2) #cl-wrap .cl-msg.ai .cl-msg-content p { margin: 0 0 .8em; }
html.cm:not(.cv2) #cl-wrap .cl-msg.ai .cl-msg-content p:last-child { margin-bottom: 0; }
html.cm:not(.cv2) #cl-wrap .cl-msg.ai .cl-msg-content :is(ul, ol) { padding-left: 1.35em; margin: .25em 0 .9em; }
html.cm:not(.cv2) #cl-wrap .cl-msg.ai .cl-msg-content li { margin: .32em 0; padding-left: .15em; }
html.cm:not(.cv2) #cl-wrap .cl-msg.ai .cl-msg-content li::marker { color: var(--accent-ember); font-weight: 700; }
html.cm:not(.cv2) #cl-wrap .cl-msg.ai .cl-msg-content strong { font-weight: 700; }
html.cm:not(.cv2) #cl-wrap .cl-msg.ai .cl-msg-content :is(h1, h2, h3, h4, h5) {
  font-family: var(--font-display); font-weight: 700; text-transform: uppercase; letter-spacing: .02em; line-height: 1.15;
  margin: 1.15em 0 .45em; color: var(--text-primary);
}
html.cm:not(.cv2) #cl-wrap .cl-msg.ai .cl-msg-content :is(h1, h2, h3, h4, h5):first-child { margin-top: 0; }
html.cm:not(.cv2) #cl-wrap .cl-msg.ai .cl-msg-content h1 { font-size: 1.24em; }
html.cm:not(.cv2) #cl-wrap .cl-msg.ai .cl-msg-content h2 { font-size: 1.14em; }
html.cm:not(.cv2) #cl-wrap .cl-msg.ai .cl-msg-content h3 { font-size: 1.02em; }
html.cm:not(.cv2) #cl-wrap .cl-msg.ai .cl-msg-content :is(h4, h5) { font-size: .93em; }
html.cm:not(.cv2) #cl-wrap .cl-msg.ai .cl-msg-content :is(h2, h3)::before { content: '.'; color: var(--accent-fill); }
html.cm:not(.cv2) #cl-wrap .cl-msg.ai .cl-msg-content a { color: var(--accent-ember); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
html.cm:not(.cv2) #cl-wrap .cl-msg.ai .cl-msg-content blockquote { margin: .4em 0 .9em; padding: .1em 0 .1em .9em; border-left: 3px solid var(--accent-fill); color: var(--text-secondary); }
html.cm:not(.cv2) #cl-wrap .cl-msg.ai .cl-msg-content :not(pre) > code { padding: .08em .36em; border-radius: 6px; background: rgba(var(--petrol-rgb), .1); font-size: .87em; }
html.cm:not(.cv2)[data-theme="dark"] #cl-wrap .cl-msg.ai .cl-msg-content :not(pre) > code { background: rgba(242, 238, 230, .1); }
html.cm:not(.cv2) #cl-wrap .cl-msg.ai .cl-msg-content hr { border: 0; border-top: 1px solid var(--border-light); margin: 1.1em 0; }
html.cm:not(.cv2) #cl-wrap .cl-msg.ai .cl-msg-content pre code { font-size: calc(14px*var(--k,1)); line-height: 1.55; }
html.cm:not(.cv2) #cl-wrap .cl-msg.user .cl-msg-content { font-size: calc(16px*var(--k,1)); line-height: 1.5; }
/* промпт-блок — проза: переносим строки, чтобы текст не уходил за край телефона */
html.cm:not(.cv2) #cl-wrap .cl-code-prompt pre, html.cm:not(.cv2) #cl-wrap .cl-code-prompt pre code { white-space: pre-wrap !important; word-break: break-word; overflow-wrap: anywhere; }
@media (min-width: 1281px) { html.cm:not(.cv2) #cl-wrap .cl-thread { max-width: calc(800px*var(--k,1)); } }
@media (max-width: 560px) {
  /* телефон: без колонки аватаров — текст во всю ширину; вопрос — своя плашка справа */
  html.cm:not(.cv2) #cl-wrap .cl-thread { padding: 0 calc(16px*var(--clz,1)); gap: calc(20px*var(--clz,1)); }
  html.cm:not(.cv2) #cl-wrap .cl-msg { gap: 0; }
  html.cm:not(.cv2) #cl-wrap .cl-msg > .cl-msg-ava { display: none !important; }
  html.cm:not(.cv2) #cl-wrap .cl-msg .cl-msg-body { min-width: 0; flex: 1 1 auto; padding-right: 0; }
  html.cm:not(.cv2) #cl-wrap .cl-msg.user .cl-msg-body { display: flex; flex-direction: column; align-items: flex-end; }
  html.cm:not(.cv2) #cl-wrap .cl-msg.user .cl-msg-role { display: none; }
  html.cm:not(.cv2) #cl-wrap .cl-msg.user .cl-msg-content { max-width: 88%; border-radius: calc(22px*var(--clz,1)) calc(22px*var(--clz,1)) calc(6px*var(--clz,1)) calc(22px*var(--clz,1)); }
  html.cm:not(.cv2) #cl-wrap .cl-msg.user .cl-user-acts { justify-content: flex-end; }
  html.cm:not(.cv2) #cl-wrap .cl-msg.ai .cl-msg-role { margin-bottom: calc(6px*var(--clz,1)); }
}

/* ═════════ 3 · ШАПКА: ☰ · название · ⓘ · чип · ⋯ ═════════ */
html.cm #cl-wrap .cl-head #cl-qp-top, html.cm #cl-wrap .cl-head #cl-gear, html.cm #cl-wrap .cl-head #cl-balance { display: none !important; }
html.cm #cl-wrap .cl-head .cl-burger { order: 0; }
html.cm #cl-wrap .cl-head .cl-head-title { order: 1; }
html.cm #cl-wrap .cl-head #cm-info { order: 5; }
html.cm #cl-wrap .cl-head #cm-chip { order: 6; }
html.cm #cl-wrap .cl-head #cl-new-top { order: 7; }
html.cm #cl-wrap .cl-head #cm-more { order: 8; }
html.cm #cl-wrap .cl-head .cl-head-title { flex: 1 1 auto; min-width: 0; }
html.cm #cl-wrap .cm-hb {
  position: relative; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; gap: calc(8px*var(--clz,1));
  height: calc(40px*var(--clz,1)); min-width: calc(40px*var(--clz,1)); padding: 0; margin: 0; border-radius: 999px;
  border: 1px solid var(--edge-hair); background: transparent; color: var(--text-primary); cursor: pointer;
  font: 700 calc(13.5px*var(--clz,1))/1 var(--font-body); -webkit-tap-highlight-color: transparent; transition: background-color .15s ease, border-color .15s ease;
}
html.cm #cl-wrap .cm-hb:hover { background: var(--hover-tint); border-color: var(--edge-copper); }
html.cm #cl-wrap .cm-hb:focus-visible { outline: 2px solid var(--accent-fill); outline-offset: 2px; }
html.cm #cl-wrap .cm-hb[aria-expanded="true"] { background: var(--chip-on-bg); color: var(--chip-on-fg); border-color: transparent; }
html.cm #cl-wrap .cm-hb[aria-expanded="true"] :is(b, small, i, .cm-hl) { color: inherit !important; }
/* ⓘ — заметная: медная кромка, янтарный знак; на ПК — с подписью */
html.cm #cl-wrap #cm-info { color: var(--accent-ember); border-color: var(--edge-copper); padding: 0 calc(14px*var(--clz,1)) 0 calc(10px*var(--clz,1)); }
html.cm #cl-wrap #cm-info .cm-hl { color: var(--text-primary); }
/* чип запаса / баланса */
html.cm #cl-wrap #cm-chip { padding: 0 calc(12px*var(--clz,1)); gap: calc(7px*var(--clz,1)); border-color: var(--edge-copper); }
html.cm #cl-wrap #cm-chip .cm-chip-t { display: inline-flex; align-items: baseline; gap: calc(4px*var(--clz,1)); white-space: nowrap; }
html.cm #cl-wrap #cm-chip .cm-ct1 { display: inline-flex; align-items: baseline; gap: calc(3px*var(--clz,1)); }
html.cm #cl-wrap #cm-chip .cm-cn { display: none; }
html.cm #cl-wrap #cm-chip .cm-chip-t b { font: 400 calc(15px*var(--clz,1))/1 var(--font-num); letter-spacing: -.01em; color: var(--text-primary); }
html.cm #cl-wrap #cm-chip .cm-chip-t small { font: 600 calc(11px*var(--clz,1))/1 var(--font-body); color: var(--text-secondary); }
html.cm #cl-wrap #cm-chip .cm-chip-t i { font-style: normal; font-size: calc(13px*var(--clz,1)); color: var(--accent-ember); }
html.cm #cl-wrap #cm-chip.warn { border-color: var(--danger); }
html.cm #cl-wrap #cm-chip.warn .cm-chip-t b { color: var(--danger); }
html.cm #cl-wrap .cm-ring {
  flex: none; width: calc(18px*var(--clz,1)); height: calc(18px*var(--clz,1)); border-radius: 50%;
  background: conic-gradient(var(--accent-fill) calc(var(--p, 0) * 1%), rgba(var(--shadow-rgb), .2) 0);
  -webkit-mask: radial-gradient(circle, transparent 46%, black 49%); mask: radial-gradient(circle, transparent 46%, black 49%);
}
html.cm[data-theme="dark"] #cl-wrap .cm-ring { background: conic-gradient(var(--accent-fill) calc(var(--p, 0) * 1%), rgba(242, 238, 230, .22) 0); }
html.cm #cl-wrap .cm-ring[hidden] { display: none; }
html.cm.cm-guest #cl-wrap #cm-chip { display: none !important; }
@media (max-width: 560px) {
  html.cm #cl-wrap .cl-head { gap: calc(6px*var(--clz,1)) !important; padding: calc(8px*var(--clz,1)) calc(10px*var(--clz,1)) !important; min-height: calc(58px*var(--clz,1)); }
  html.cm #cl-wrap .cl-head .cl-back, html.cm #cl-wrap .cl-head #cl-new-top { display: none !important; }
  html.cm #cl-wrap #cm-info { width: calc(38px*var(--clz,1)); min-width: calc(38px*var(--clz,1)); height: calc(38px*var(--clz,1)); padding: 0; }
  html.cm #cl-wrap #cm-info .cm-hl { display: none; }
  html.cm #cl-wrap #cm-more { width: calc(38px*var(--clz,1)); min-width: calc(38px*var(--clz,1)); height: calc(38px*var(--clz,1)); }
  html.cm #cl-wrap #cm-chip { height: calc(38px*var(--clz,1)); padding: 0 calc(10px*var(--clz,1)); }
  html.cm #cl-wrap .cm-hb::after { content: ''; position: absolute; left: 50%; top: 50%; width: max(100%, calc(44px*var(--clz,1))); height: calc(44px*var(--clz,1)); transform: translate(-50%, -50%); }
  /* название чата — в шапке (до 2 строк), отдельная строка названия больше не нужна */
  html.cm:not(.cv2) #cl-wrap .cl-mchat { display: none !important; }
  html.cm:not(.cv2) #cl-wrap .cl-head .cl-head-title { display: flex !important; align-items: center; overflow: hidden; }
  html.cm:not(.cv2) #cl-wrap .cl-head .cl-logo, html.cm:not(.cv2) #cl-wrap #cl-head-menu { display: none !important; }
  html.cm:not(.cv2) #cl-wrap .cl-head .cl-head-chat {
    display: -webkit-box !important; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; white-space: normal !important;
    max-width: 100% !important; min-width: 0; padding: 0 !important; text-align: left; word-break: break-word;
    font: 700 calc(15.5px*var(--clz,1))/1.12 var(--font-display) !important; text-transform: uppercase; letter-spacing: .012em; color: var(--text-primary);
    max-height: 2.24em;
  }
  /* телефон: чип в две строки — «98% / ЗАПАС» или «391 ⓥ / ≈ 3 489 СООБЩ.» (строка под полем на телефоне не нужна) */
  html.cm #cl-wrap #cm-chip { padding: 0 calc(10px*var(--clz,1)) 0 calc(10px*var(--clz,1)); gap: calc(6px*var(--clz,1)); }
  html.cm #cl-wrap #cm-chip.cm-has-tariff { padding-left: calc(8px*var(--clz,1)); }
  html.cm #cl-wrap #cm-chip .cm-chip-t { flex-direction: column; align-items: flex-start; gap: 2px; }
  html.cm #cl-wrap #cm-chip .cm-chip-t b { font-size: calc(14px*var(--clz,1)); }
  html.cm #cl-wrap #cm-chip .cm-chip-t i { font-size: calc(12px*var(--clz,1)); }
  html.cm #cl-wrap #cm-chip .cm-cn { display: block; }
  html.cm #cl-wrap #cm-chip .cm-chip-t small { font: 600 calc(9px*var(--clz,1))/1 var(--font-num); letter-spacing: .08em; text-transform: uppercase; color: var(--text-secondary); }
}
@media (max-width: 359px) {
  html.cm #cl-wrap #cm-chip .cm-chip-t small { display: none; }
}

/* ═════════ 2 · ПОЛЕ ВВОДА: «＋» · «Режимы» · модель · микрофон · «Отправить» ═════════ */
html.cm:not(.cv2) #cl-wrap .cl-input-bar { gap: calc(6px*var(--clz,1)) !important; align-items: center !important; flex-wrap: nowrap !important; }
html.cm:not(.cv2) #cl-wrap .cl-input-bar > :is(.cm-plus, .cl-tools-pick, .cl-mic, .cl-send) { flex-shrink: 0 !important; }
html.cm:not(.cv2) #cl-wrap .cm-plus {
  position: relative; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center;
  width: calc(40px*var(--clz,1)); height: calc(40px*var(--clz,1)); padding: 0; border-radius: 50%; border: 1.5px solid var(--btn-line);
  background: transparent; color: var(--text-primary); cursor: pointer; transition: background-color .15s ease, transform .15s ease;
}
html.cm:not(.cv2) #cl-wrap .cm-plus:hover { background: var(--hover-tint); }
html.cm:not(.cv2) #cl-wrap .cm-plus[aria-expanded="true"] { background: var(--chip-on-bg); color: var(--chip-on-fg); border-color: transparent; }
html.cm:not(.cv2) #cl-wrap .cm-plus[aria-expanded="true"] .cm-svg { transform: rotate(45deg); }
html.cm:not(.cv2) #cl-wrap .cm-plus .cm-svg { transition: transform .2s ease; }
html.cm:not(.cv2) #cl-wrap .cm-plus::after { content: ''; position: absolute; inset: calc(-4px*var(--clz,1)); border-radius: 50%; }
/* «Режимы» — родная кнопка панели с подписью и счётчиком */
html.cm:not(.cv2) #cl-wrap :is(#cm-modes, #cl-tools-btn.cm-modes) {
  position: relative; display: inline-flex !important; align-items: center; gap: calc(6px*var(--clz,1)); height: calc(40px*var(--clz,1)) !important;
  min-height: calc(40px*var(--clz,1)) !important; width: auto !important; padding: 0 calc(13px*var(--clz,1)) 0 calc(11px*var(--clz,1)) !important;
  border: 1.5px solid var(--btn-line) !important; border-radius: 999px !important; background: transparent !important; color: var(--text-primary) !important;
  font: 700 calc(13.5px*var(--clz,1))/1 var(--font-body) !important; white-space: nowrap;
}
html.cm:not(.cv2) #cl-wrap #cl-tools-btn.cm-modes .cl-tools-lbl { display: inline !important; font: inherit; color: inherit; }
html.cm:not(.cv2) #cl-wrap #cm-modes { flex: 0 0 auto; cursor: pointer; }
html.cm:not(.cv2) #cl-wrap #cm-modes:hover { background: var(--hover-tint) !important; }
html.cm:not(.cv2) #cl-wrap #cm-modes[aria-expanded="true"] { background: var(--chip-on-bg) !important; color: var(--chip-on-fg) !important; border-color: transparent !important; }
html.cm:not(.cv2) #cl-wrap #cm-modes[aria-expanded="true"] .cm-mi { color: inherit; }
html.cm-claude:not(.cv2) #cl-wrap .cl-input-bar > .cl-tools-pick { display: none !important; }
html.cm:not(.cv2) #cl-wrap :is(#cm-modes, #cl-tools-btn.cm-modes) .cm-mi { width: calc(18px*var(--clz,1)); height: calc(18px*var(--clz,1)); color: var(--accent-ember); flex: none; }
html.cm:not(.cv2) #cl-wrap :is(#cm-modes, #cl-tools-btn.cm-modes).cm-has { border-color: var(--accent-fill) !important; }
html.cm:not(.cv2) #cl-wrap :is(#cm-modes, #cl-tools-btn) .cm-badge {
  display: inline-grid; place-items: center; min-width: calc(19px*var(--clz,1)); height: calc(19px*var(--clz,1)); padding: 0 calc(5px*var(--clz,1));
  border-radius: 999px; background: var(--accent-grad); color: var(--on-accent); font: 700 calc(11px*var(--clz,1))/1 var(--font-num); font-style: normal;
}
html.cm:not(.cv2) #cl-wrap :is(#cm-modes, #cl-tools-btn) .cm-badge[hidden] { display: none; }
/* заголовок родной панели режимов */
html.cm #cl-wrap #cl-tools-menu .cm-tm-h { display: flex; flex-direction: column; gap: calc(3px*var(--clz,1)); padding: calc(4px*var(--clz,1)) calc(8px*var(--clz,1)) calc(10px*var(--clz,1)); }
html.cm #cl-wrap #cl-tools-menu .cm-tm-h b { font: 700 calc(19px*var(--clz,1))/1 var(--font-display); text-transform: uppercase; letter-spacing: .015em; color: var(--text-primary); }
html.cm #cl-wrap #cl-tools-menu .cm-tm-h small { font: 500 calc(12.5px*var(--clz,1))/1.35 var(--font-body); color: var(--text-secondary); }
html.cm.cv2 #cl-wrap #cl-tools-menu .cm-tm-h { display: none; }
/* чип модели — пилюля с названием, сжимается последней */
html.cm:not(.cv2) #cl-wrap .cl-input-bar .cl-model-pick { flex: 0 1 auto !important; min-width: 0 !important; max-width: calc(170px*var(--clz,1)); }
html.cm:not(.cv2) #cl-wrap .cl-model-btn.cm-model {
  display: inline-flex !important; align-items: center; gap: calc(4px*var(--clz,1)); height: calc(40px*var(--clz,1)) !important; min-height: calc(40px*var(--clz,1)) !important;
  max-width: 100% !important; min-width: 0 !important; padding: 0 calc(10px*var(--clz,1)) 0 calc(13px*var(--clz,1)) !important; box-sizing: border-box;
  border: 1.5px solid var(--btn-line) !important; border-radius: 999px !important; background: transparent !important; color: var(--text-primary) !important;
  font: 700 calc(13.5px*var(--clz,1))/1 var(--font-body) !important;
}
html.cm:not(.cv2) #cl-wrap .cl-model-btn.cm-model #cl-model-label { max-width: none !important; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
html.cm:not(.cv2) #cl-wrap .cl-model-btn.cm-model svg { flex: none; }
/* микрофон — тихий круг; «Отправить» — огонь */
html.cm:not(.cv2) #cl-wrap .cl-input-bar .cl-mic { width: calc(38px*var(--clz,1)) !important; height: calc(38px*var(--clz,1)) !important; }
html.cm:not(.cv2) #cl-wrap .cl-input-bar .cl-send { width: calc(44px*var(--clz,1)) !important; height: calc(44px*var(--clz,1)) !important; background: var(--accent-grad); color: var(--on-accent); }
@media (max-width: 560px) {
  html.cm:not(.cv2) #cl-wrap .cl-input-bar { gap: calc(5px*var(--clz,1)) !important; }
  html.cm:not(.cv2) #cl-wrap .cl-input-bar > :is(#cl-think-inline, #cl-search-inline) { display: none !important; }
  html.cm:not(.cv2) #cl-wrap .cl-input-bar .cl-model-pick { max-width: calc(130px*var(--clz,1)); }
  html.cm:not(.cv2) #cl-wrap .cl-model-btn.cm-model { padding: 0 calc(7px*var(--clz,1)) 0 calc(11px*var(--clz,1)) !important; }
  html.cm:not(.cv2) #cl-wrap .cl-input-bar .cl-mic { width: calc(32px*var(--clz,1)) !important; height: calc(32px*var(--clz,1)) !important; border-color: transparent !important; }
  /* 390 px: «＋» 38 · «Режимы» ≈100 · модель ≈95 · микрофон 32 · «Отправить» 42 — всё в строку без многоточия у модели */
  html.cm:not(.cv2) #cl-wrap .cl-input-bar { gap: calc(4px*var(--clz,1)) !important; }
  html.cm:not(.cv2) #cl-wrap .cl-input-box { padding-left: calc(10px*var(--clz,1)) !important; padding-right: calc(10px*var(--clz,1)) !important; }
  html.cm:not(.cv2) #cl-wrap .cl-input-box .cl-input { padding-left: calc(6px*var(--clz,1)) !important; padding-right: calc(6px*var(--clz,1)) !important; }
  html.cm:not(.cv2) #cl-wrap :is(#cm-modes, #cl-tools-btn.cm-modes) { padding: 0 calc(9px*var(--clz,1)) 0 calc(10px*var(--clz,1)) !important; gap: calc(5px*var(--clz,1)); font-size: calc(13px*var(--clz,1)) !important; }
  html.cm:not(.cv2) #cl-wrap :is(#cm-modes, #cl-tools-btn.cm-modes) .cm-mi { display: none; }
  html.cm:not(.cv2) #cl-wrap .cm-plus { width: calc(38px*var(--clz,1)); height: calc(38px*var(--clz,1)); }
  html.cm:not(.cv2) #cl-wrap .cl-input-bar .cl-send { width: calc(42px*var(--clz,1)) !important; height: calc(42px*var(--clz,1)) !important; }
  html.cm:not(.cv2) #cl-wrap .cl-model-btn.cm-model { font-size: calc(13px*var(--clz,1)) !important; gap: calc(3px*var(--clz,1)); }
  html.cm:not(.cv2) #cl-wrap .cl-model-btn.cm-model svg { width: calc(11px*var(--clz,1)); height: calc(11px*var(--clz,1)); }
}
@media (max-width: 374px) {
  html.cm:not(.cv2) #cl-wrap .cl-input-bar .cl-mic { display: none !important; }
  html.cm:not(.cv2) #cl-wrap .cl-input-bar .cl-model-pick { max-width: calc(100px*var(--clz,1)); }
}

/* ═════════ 6 · ОДНА КОРОТКАЯ СТРОКА ПОД ПОЛЕМ (вместо длинной строки баланса) ═════════ */
html.cm:not(.cm-guest) #cl-wrap #cl-input-foot { display: none !important; }
html.cm #cl-wrap .cm-foot {
  display: block; width: 100%; max-width: 100%; margin: calc(7px*var(--clz,1)) auto 0; padding: calc(3px*var(--clz,1)) calc(6px*var(--clz,1));
  border: 0; background: none; cursor: pointer; text-align: center; color: var(--text-secondary);
  font: 500 calc(12.5px*var(--clz,1))/1.35 var(--font-body); -webkit-tap-highlight-color: transparent;
}
html.cm #cl-wrap .cm-foot[hidden] { display: none; }
html.cm #cl-wrap .cm-foot .cm-ft { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html.cm #cl-wrap .cm-foot b { font-weight: 700; color: var(--text-primary); }
html.cm #cl-wrap .cm-foot u { color: var(--accent-ember); text-decoration: underline; text-decoration-color: var(--edge-copper); text-underline-offset: 3px; }
html.cm #cl-wrap .cm-foot.warn b { color: var(--danger); }
@media (min-width: 900px) {
  html.cm.cm-typing:not(.cm-guest) #cl-wrap #cl-input-foot { display: block !important; }
  html.cm.cm-typing #cl-wrap .cm-foot { display: none; }
}
@media (max-width: 560px) {
  /* ручка «недавних задач» сайта живёт у нижнего края справа — строку держим над ней */
  html.cm #cl-wrap .cm-foot:not(.warn) { display: none; }
  html.cm #cl-wrap .cm-foot.warn { margin-top: calc(6px*var(--clz,1)); padding: 0 calc(118px*var(--clz,1)) 0 calc(6px*var(--clz,1)); text-align: left; }
}

/* ═════════ ВИД v2 (html.cv2) — те же шапка и строка кнопок ═════════ */
html.cm.cv2 body #cl-wrap .cl-head > .ca-headdock { order: 9; margin-left: auto; }
html.cm.cv2 body #cl-wrap .ca-headdock .cm-hb { height: calc(38px*var(--clz,1)); min-width: calc(38px*var(--clz,1)); border: 0; background: transparent; }
html.cm.cv2 body #cl-wrap .ca-headdock #cm-chip { background: rgba(var(--shadow-rgb), .08); }
html.cm.cv2[data-theme="dark"] body #cl-wrap .ca-headdock #cm-chip { background: rgba(242, 238, 230, .08); }
@media (max-width: 560px) {
  html.cm.cv2 body #cl-wrap .ca-headdock .cl-new-top { display: none !important; }
  html.cm.cv2 body #cl-wrap .ca-headdock #cm-info { width: calc(38px*var(--clz,1)); padding: 0; }
}
html.cm.cv2 body #cl-wrap .cm-acts .cl-act .ca-ib { display: none; }
html.cm.cv2 body #cl-wrap .cm-acts .cl-act > svg.cm-ai { display: inline-block !important; }
html.cm.cv2 body #cl-wrap .ca-headdock .cm-hb[aria-expanded="true"] { background: var(--chip-on-bg) !important; color: var(--chip-on-fg) !important; }

/* ═════════ ШТОРКИ И ОКНА (⋯ · «＋» · ⓘ · тарифы) ═════════ */
.cm-sheet { position: fixed; inset: 0; z-index: 8995; display: none; color: var(--text-primary); font-family: var(--font-body); }
.cm-sheet.open { display: block; }
.cm-sh-back { position: absolute; inset: 0; background: rgba(var(--shadow-rgb), .5); animation: cmFade .2s ease both; }
.cm-sh-card {
  position: absolute; left: 0; right: 0; bottom: 0; display: flex; flex-direction: column; max-height: 90vh; max-height: 90dvh;
  background: var(--bg-secondary); color: var(--text-primary); border: 1px solid var(--edge-copper); border-bottom: 0;
  border-radius: 24px 24px 0 0; box-shadow: var(--shadow-3); padding-bottom: env(safe-area-inset-bottom); animation: cmUp .28s cubic-bezier(.22, 1, .36, 1) both;
  overflow: hidden; box-sizing: border-box;
}
.cm-sh-grab { flex: none; width: 44px; height: 5px; margin: 8px auto 0; border-radius: 3px; background: var(--border-light); background: rgba(var(--shadow-rgb), .22); }
[data-theme="dark"] .cm-sh-grab { background: rgba(242, 238, 230, .28); }
.cm-sh-h { flex: none; display: flex; align-items: center; gap: 12px; padding: 10px 12px 8px 20px; }
.cm-sh-t { flex: 1; min-width: 0; margin: 0; font: 700 calc(23px*var(--k,1))/1.05 var(--font-display); text-transform: uppercase; letter-spacing: .012em; color: var(--text-primary); }
.cm-sh-t .cm-dot, .cm-dot { color: var(--accent-fill); font-style: normal; }
.cm-sh-x {
  flex: none; display: inline-flex; align-items: center; justify-content: center; width: calc(42px*var(--k,1)); height: calc(42px*var(--k,1));
  border-radius: 50%; border: 1px solid var(--edge-hair); background: transparent; color: var(--text-primary); cursor: pointer;
}
.cm-sh-x:hover { background: var(--hover-tint); }
.cm-sh-x:focus-visible, .cm-row:focus-visible, .cm-go:focus-visible, .cm-buy:focus-visible { outline: 2px solid var(--accent-fill); outline-offset: 2px; }
.cm-sh-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; padding: 4px 14px 22px; }
@media (min-width: 561px) {
  .cm-sh-card {
    left: 50%; right: auto; top: 50%; bottom: auto; width: min(calc(720px*var(--k,1)), calc(100vw - 48px)); max-height: min(86vh, calc(920px*var(--k,1)));
    transform: translate(-50%, -50%); border-bottom: 1px solid var(--edge-copper); border-radius: calc(28px*var(--k,1)); animation: cmFade .18s ease both; padding-bottom: 0;
  }
  .cm-sh-grab { display: none; }
  .cm-sh-h { padding: calc(20px*var(--k,1)) calc(18px*var(--k,1)) calc(10px*var(--k,1)) calc(28px*var(--k,1)); }
  .cm-sh-t { font-size: calc(28px*var(--k,1)); }
  .cm-sh-body { padding: calc(4px*var(--k,1)) calc(24px*var(--k,1)) calc(26px*var(--k,1)); }
  .cm-sh-tar .cm-sh-card { width: min(calc(1080px*var(--k,1)), calc(100vw - 48px)); }
  /* окошко у своей кнопки (⋯ в шапке, «＋» у поля) */
  .cm-sheet.cm-pop .cm-sh-back { background: transparent; animation: none; }
  .cm-sheet.cm-pop .cm-sh-card {
    top: auto; right: auto; transform: none; width: calc(392px*var(--k,1)); max-height: min(78vh, calc(640px*var(--k,1)));
    border-radius: calc(24px*var(--k,1)); box-shadow: var(--shadow-3);
  }
  .cm-sheet.cm-pop .cm-sh-h { padding: calc(16px*var(--k,1)) calc(12px*var(--k,1)) calc(4px*var(--k,1)) calc(20px*var(--k,1)); }
  .cm-sheet.cm-pop .cm-sh-t { font-size: calc(20px*var(--k,1)); }
  .cm-sheet.cm-pop .cm-sh-x { width: calc(36px*var(--k,1)); height: calc(36px*var(--k,1)); }
  .cm-sheet.cm-pop .cm-sh-body { padding: calc(4px*var(--k,1)) calc(10px*var(--k,1)) calc(12px*var(--k,1)); }
}
@keyframes cmUp { from { transform: translateY(40px); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes cmFade { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .cm-sh-card, .cm-sh-back { animation: none !important; } }

/* пункт-строка: номер · круглый значок · подпись · стрелка (рефы 02 «шаги с бейджами») */
.cm-list { display: flex; flex-direction: column; gap: 4px; }
.cm-row {
  display: flex; align-items: center; gap: calc(12px*var(--k,1)); width: 100%; min-height: calc(62px*var(--k,1)); box-sizing: border-box;
  padding: calc(8px*var(--k,1)) calc(10px*var(--k,1)) calc(8px*var(--k,1)) calc(6px*var(--k,1)); border: 1px solid transparent; border-radius: calc(18px*var(--k,1));
  background: transparent; color: var(--text-primary); text-align: left; font: inherit; cursor: pointer; -webkit-tap-highlight-color: transparent;
}
.cm-row[hidden] { display: none; }
.cm-row:hover, .cm-row:focus-visible { background: var(--hover-tint); border-color: var(--edge-hair); }
.cm-row:active { transform: scale(.99); }
.cm-rn { flex: none; width: calc(30px*var(--k,1)); text-align: right; font: 200 calc(22px*var(--k,1))/1 var(--font-num); letter-spacing: -.04em; color: var(--accent-ember); }
.cm-bd { flex: none; display: inline-flex; align-items: center; justify-content: center; width: calc(42px*var(--k,1)); height: calc(42px*var(--k,1)); border-radius: 50%; }
.cm-bd .cm-svg { width: calc(19px*var(--k,1)); height: calc(19px*var(--k,1)); }
.cm-bd-f { background: var(--accent-grad); color: var(--on-accent); }
.cm-bd-p { background: var(--petrol-2); color: var(--amber); box-shadow: inset 0 0 0 1.5px rgba(224, 149, 90, .6); }
.cm-rt { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.cm-rt b { font: 700 calc(15.5px*var(--k,1))/1.2 var(--font-body); color: var(--text-primary); }
.cm-rt small { font: 500 calc(13px*var(--k,1))/1.3 var(--font-body); color: var(--text-secondary); }
.cm-rgo { flex: none; display: inline-flex; align-items: center; justify-content: center; width: calc(30px*var(--k,1)); height: calc(30px*var(--k,1)); border-radius: 50%; color: var(--text-muted); }
.cm-row:hover .cm-rgo { color: var(--accent-ember); }
.cm-sw { flex: none; position: relative; width: calc(44px*var(--k,1)); height: calc(26px*var(--k,1)); border-radius: 999px; background: var(--bg-inset); box-shadow: inset 0 0 0 1px var(--edge-hair); transition: background-color .15s ease; }
.cm-sw::after { content: ''; position: absolute; top: 3px; left: 3px; width: calc(20px*var(--k,1)); height: calc(20px*var(--k,1)); border-radius: 50%; background: var(--bg-tertiary); box-shadow: var(--shadow-1); transition: transform .18s ease; }
.cm-row.on .cm-sw { background: var(--accent-fill); }
.cm-row.on .cm-sw::after { transform: translateX(calc(18px*var(--k,1))); }
/* родная кнопка внутри значка «＋» — только знак, нажатие ловит строка */
.cm-ri > button.cm-moved {
  display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 100% !important; height: 100% !important;
  min-width: 0 !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 50% !important;
  background: transparent !important; color: inherit !important; box-shadow: none !important; font-size: 0 !important; pointer-events: none; position: static !important;
}
.cm-ri > button.cm-moved::after, .cm-ri > button.cm-moved::before { display: none !important; content: none !important; }
.cm-ri > button.cm-moved .cm-svg { width: calc(19px*var(--k,1)); height: calc(19px*var(--k,1)); }

/* кнопка-пилюля со стрелкой в кружке (как на главной) */
.cm-go {
  display: inline-flex; align-items: center; gap: calc(14px*var(--k,1)); min-height: calc(50px*var(--k,1)); margin: 6px 0 2px;
  padding: calc(7px*var(--k,1)) calc(7px*var(--k,1)) calc(7px*var(--k,1)) calc(22px*var(--k,1)); border: 0; border-radius: 999px;
  background: var(--accent-grad); color: var(--on-accent); font: 700 calc(14.5px*var(--k,1))/1.1 var(--font-body); cursor: pointer; text-decoration: none;
  box-shadow: 0 calc(14px*var(--k,1)) calc(26px*var(--k,1)) calc(-16px*var(--k,1)) rgba(var(--accent-rgb), .75); transition: transform .2s ease;
}
.cm-go:hover { transform: translateY(-1px); }
.cm-go > i { flex: none; display: inline-flex; align-items: center; justify-content: center; width: calc(36px*var(--k,1)); height: calc(36px*var(--k,1)); border-radius: 50%; background: var(--petrol-2); color: var(--accent-fill); font-style: normal; }
.cm-go-s { min-height: calc(42px*var(--k,1)); padding-left: calc(16px*var(--k,1)); gap: calc(10px*var(--k,1)); font-size: calc(13.5px*var(--k,1)); margin: 0; }
.cm-go-s > i { width: calc(30px*var(--k,1)); height: calc(30px*var(--k,1)); }

/* всплывашки */
.cm-toast {
  position: fixed; left: 50%; bottom: calc(118px + env(safe-area-inset-bottom)); z-index: 9010; transform: translate(-50%, 10px); opacity: 0;
  padding: 11px 20px; border-radius: 999px; background: var(--chip-on-bg); color: var(--chip-on-fg); font: 700 calc(14px*var(--k,1))/1.2 var(--font-body);
  box-shadow: var(--shadow-2); pointer-events: none; white-space: nowrap; transition: opacity .2s ease, transform .2s ease;
}
.cm-toast.show { opacity: 1; transform: translate(-50%, 0); }
.cm-toast-ok { background: var(--accent-grad); color: var(--on-accent); }
.cm-bubble {
  position: fixed; z-index: 9010; padding: 6px 12px; border-radius: 999px; background: var(--chip-on-bg); color: var(--chip-on-fg);
  font: 700 calc(12.5px*var(--k,1))/1.2 var(--font-body); white-space: nowrap; pointer-events: none; opacity: 0; transform: translateY(4px); transition: opacity .16s ease, transform .16s ease;
}
.cm-bubble.show { opacity: 1; transform: none; }

/* ═════════ 4 · «ⓘ КАК ЭТО РАБОТАЕТ» ═════════ */
.cm-lead { margin: 2px 6px 12px; font: 500 calc(15px*var(--k,1))/1.5 var(--font-body); color: var(--text-secondary); }
.cm-toc { display: flex; gap: 8px; margin: 0 -14px 6px; padding: 2px 14px 12px; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.cm-toc::-webkit-scrollbar { display: none; }
.cm-toc button {
  flex: none; display: inline-flex; align-items: center; gap: 6px; height: calc(36px*var(--k,1)); padding: 0 calc(14px*var(--k,1)); border-radius: 999px;
  border: 1px solid var(--edge-hair); background: var(--bg-tertiary); color: var(--text-primary); font: 600 calc(13px*var(--k,1))/1 var(--font-body); white-space: nowrap; cursor: pointer;
}
.cm-toc button:hover { border-color: var(--edge-copper); }
.cm-toc i { font: 300 calc(12px*var(--k,1))/1 var(--font-num); font-style: normal; color: var(--accent-ember); }
@media (min-width: 561px) { .cm-toc { flex-wrap: wrap; overflow: visible; margin: 0 0 8px; padding: 2px 0 14px; } }
.cm-sec { padding: 16px 6px 14px; border-top: 1px solid var(--border-light); scroll-margin-top: 6px; }
.cm-sec-h { display: flex; align-items: center; gap: 10px; margin: 0 0 10px; }
.cm-sec-h .cm-rn { width: auto; text-align: left; }
.cm-sec-h h3 { margin: 0; min-width: 0; font: 700 calc(18px*var(--k,1))/1.15 var(--font-display); text-transform: uppercase; letter-spacing: .015em; color: var(--text-primary); }
.cm-sec-b p { margin: 0 0 10px; font: 400 calc(15.5px*var(--k,1))/1.6 var(--font-body); color: var(--text-primary); }
.cm-sec-b b { font-weight: 700; }
.cm-sec-b .cm-go { margin-top: 2px; }
.cm-kbd {
  display: inline-flex; align-items: center; gap: 4px; padding: 1px 9px; border-radius: 999px; border: 1px solid var(--edge-copper); background: var(--bg-tertiary);
  font: 700 .86em/1.5 var(--font-body); white-space: nowrap; vertical-align: 1px; color: var(--text-primary);
}
.cm-kbd .cm-svg { width: 1.05em; height: 1.05em; color: var(--accent-ember); }
.cm-kbd-f { background: var(--accent-grad); color: var(--on-accent); border-color: transparent; }
.cm-mods { list-style: none; margin: 0 0 10px; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.cm-mod { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; padding: 10px 14px; border-radius: 16px; background: var(--bg-tertiary); border: 1px solid var(--border-light); }
.cm-mod b { font: 700 calc(15.5px*var(--k,1))/1.25 var(--font-body); color: var(--text-primary); }
.cm-mod > span { flex-basis: 100%; font: 500 calc(14px*var(--k,1))/1.45 var(--font-body); color: var(--text-secondary); }
.cm-tag { display: inline-block; padding: 3px 8px; border-radius: 999px; border: 1px solid var(--edge-hair); font: 600 calc(10.5px*var(--k,1))/1 var(--font-num); font-style: normal; letter-spacing: .08em; text-transform: uppercase; color: var(--text-secondary); }
.cm-tag-on { background: var(--accent-grad); color: var(--on-accent); border-color: transparent; }
.cm-legend { list-style: none; margin: 0 0 10px; padding: 0; display: grid; grid-template-columns: 1fr; gap: 8px; }
@media (min-width: 561px) { .cm-legend { grid-template-columns: 1fr 1fr; } }
.cm-legend li { display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; column-gap: 12px; align-items: center; padding: 8px 12px 8px 8px; border-radius: 16px; background: var(--bg-tertiary); border: 1px solid var(--border-light); }
.cm-legend li > b { font: 700 calc(14.5px*var(--k,1))/1.2 var(--font-body); color: var(--text-primary); }
.cm-legend li > span:last-child { grid-column: 2; font: 500 calc(13px*var(--k,1))/1.35 var(--font-body); color: var(--text-secondary); }
.cm-lg-ic { grid-row: 1 / span 2; display: inline-flex; align-items: center; justify-content: center; width: calc(36px*var(--k,1)); height: calc(36px*var(--k,1)); border-radius: 50%; color: var(--text-muted); box-shadow: inset 0 0 0 1px var(--edge-hair); }
.cm-lg-txt { width: auto; min-width: calc(36px*var(--k,1)); padding: 0 6px; border-radius: 999px; font: 400 calc(11px*var(--k,1))/1 var(--font-num); white-space: nowrap; }

/* ═════════ 5 · «ТАРИФЫ ИИ-ЧАТОВ» ═════════ */
/* ваш тариф — петроль-плашка (текст светлый в обеих темах) */
.cm-t-act {
  margin: 0 0 14px; padding: 16px 18px 18px; border-radius: 22px; color: var(--on-petrol);
  background: linear-gradient(150deg, var(--petrol) 0%, var(--petrol-2) 80%); border: 1px solid rgba(224, 149, 90, .55);
}
.cm-t-k { display: block; font: 600 calc(11px*var(--k,1))/1.2 var(--font-num); letter-spacing: .18em; text-transform: uppercase; color: var(--amber); }
.cm-t-actrow { display: flex; align-items: center; gap: 16px; margin: 10px 0 12px; }
.cm-t-big { font: 200 calc(56px*var(--k,1))/.9 var(--font-num); letter-spacing: -.04em; color: var(--on-petrol); }
.cm-t-big small { font-size: .45em; font-weight: 300; margin-left: 2px; }
.cm-t-actrow > span { font: 500 calc(14px*var(--k,1))/1.5 var(--font-body); color: rgba(242, 238, 230, .86); }
.cm-t-actrow > span b { color: var(--on-petrol); }
.cm-bar { position: relative; height: 6px; border-radius: 99px; background: rgba(242, 238, 230, .16); overflow: hidden; }
.cm-bar i { position: absolute; inset: 0 auto 0 0; border-radius: inherit; background: linear-gradient(90deg, var(--accent-fill), var(--amber)); }
/* оранжевое поле с крючком и карточками */
.cm-t-field { padding: 20px 14px 16px; border-radius: 26px; background: var(--accent-grad); color: var(--on-accent); }
.cm-t-hook { padding: 0 4px; }
.cm-t-hook .cm-t-k { color: var(--petrol-2); }
.cm-t-hook h3 { margin: 8px 0 8px; font: 700 calc(32px*var(--k,1))/.98 var(--font-display); text-transform: uppercase; letter-spacing: .005em; color: var(--on-accent); }
.cm-t-hook p { margin: 0 0 16px; font: 500 calc(15px*var(--k,1))/1.5 var(--font-body); color: var(--on-accent); }
.cm-t-cards { display: grid; grid-template-columns: 1fr; gap: 12px; }
@media (min-width: 761px) { .cm-t-cards { grid-template-columns: repeat(3, 1fr); } .cm-t-field { padding: calc(26px*var(--k,1)); } .cm-t-hook h3 { font-size: calc(44px*var(--k,1)); } }
.cm-card {
  position: relative; display: flex; flex-direction: column; gap: 6px; padding: 16px 16px 16px; border-radius: 22px; color: var(--on-petrol);
  background: linear-gradient(150deg, var(--petrol) 0%, var(--petrol-2) 80%); border: 1px solid rgba(224, 149, 90, .6);
  box-shadow: 0 calc(22px*var(--k,1)) calc(40px*var(--k,1)) calc(-30px*var(--k,1)) rgba(4, 22, 30, .8);
}
.cm-card-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.cm-card-tag { font: 600 calc(11px*var(--k,1))/1 var(--font-num); letter-spacing: .16em; color: var(--amber); }
.cm-card-days { padding: 4px 9px; border-radius: 999px; border: 1px solid rgba(242, 238, 230, .25); font: 600 calc(11.5px*var(--k,1))/1 var(--font-body); color: rgba(242, 238, 230, .86); }
.cm-card-price { display: flex; align-items: baseline; gap: 8px; margin-top: 4px; }
.cm-card-price b { font: 300 calc(50px*var(--k,1))/1 var(--font-num); letter-spacing: -.03em; }
.cm-card-price span { font: 600 calc(15px*var(--k,1))/1 var(--font-body); }
.cm-card-rub { font: 400 calc(15px*var(--k,1))/1.2 var(--font-num); color: rgba(242, 238, 230, .78); }
.cm-card-main { margin-top: 6px; font: 600 calc(15px*var(--k,1))/1.4 var(--font-body); }
.cm-card-main b { font-weight: 800; }
.cm-card-or { font: 500 calc(13px*var(--k,1))/1.45 var(--font-body); color: rgba(242, 238, 230, .78); }
.cm-buy {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; min-height: calc(50px*var(--k,1)); margin-top: auto;
  padding: calc(7px*var(--k,1)) calc(7px*var(--k,1)) calc(7px*var(--k,1)) calc(20px*var(--k,1)); border: 0; border-radius: 999px; box-sizing: border-box;
  background: var(--accent-grad); color: var(--on-accent); font: 700 calc(14.5px*var(--k,1))/1.1 var(--font-body); cursor: pointer; text-align: left;
}
.cm-card .cm-buy { margin-top: 10px; }
.cm-buy > i { flex: none; display: inline-flex; align-items: center; justify-content: center; width: calc(36px*var(--k,1)); height: calc(36px*var(--k,1)); border-radius: 50%; background: var(--petrol-2); color: var(--accent-fill); font-style: normal; }
.cm-buy.busy, .cm-buy:disabled { opacity: .7; cursor: progress; }
.cm-buy.busy > i { animation: cmSpin 1s linear infinite; }
@keyframes cmSpin { to { transform: rotate(360deg); } }
.cm-card-msg { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; margin-top: 8px; padding: 10px 12px; border-radius: 14px; background: rgba(4, 22, 30, .35); border: 1px solid rgba(245, 155, 31, .55); font: 500 calc(13.5px*var(--k,1))/1.4 var(--font-body); }
.cm-card-msg[hidden] { display: none; }
.cm-card-msg b { color: var(--amber); font-weight: 800; }
.cm-card-msg > span { flex: 1 1 60%; }
/* выделенная (×4) — off-white на оранжевом, кнопка — петроль с оранжевым кружком */
.cm-card-hi { background: var(--on-petrol); color: var(--on-accent); border: 2px solid var(--petrol-2); }
.cm-card-hi .cm-card-tag { color: var(--petrol); }
.cm-card-hi .cm-card-days { border-color: rgba(15, 52, 68, .3); color: var(--petrol-2); }
.cm-card-hi :is(.cm-card-rub, .cm-card-or) { color: rgba(17, 17, 17, .72); }
.cm-card-hi .cm-buy { background: linear-gradient(150deg, var(--petrol) 0%, var(--petrol-2) 80%); color: var(--on-petrol); box-shadow: inset 0 0 0 1px rgba(224, 149, 90, .7); }
.cm-card-hi .cm-buy > i { background: var(--accent-fill); color: var(--on-accent); }
.cm-card-hi .cm-card-msg { background: rgba(15, 52, 68, .08); border-color: rgba(15, 52, 68, .35); }
.cm-card-hi .cm-card-msg b { color: var(--petrol-2); }
.cm-card-rib { position: absolute; top: -11px; right: 16px; padding: 5px 11px; border-radius: 999px; background: var(--petrol-2); color: var(--amber); font: 700 calc(10.5px*var(--k,1))/1 var(--font-num); letter-spacing: .16em; text-transform: uppercase; }
.cm-t-note { margin: 14px 4px 0; font: 500 calc(13px*var(--k,1))/1.5 var(--font-body); color: var(--on-accent); }
/* «для чего лучше каждый ИИ» — колонки (компоновка ref05, цвета EMBER) */
.cm-t-h { margin: 22px 4px 12px; font: 700 calc(21px*var(--k,1))/1.1 var(--font-display); text-transform: uppercase; letter-spacing: .012em; color: var(--text-primary); }
.cm-t-ai { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
@media (min-width: 761px) { .cm-t-ai { grid-template-columns: repeat(4, 1fr); } }
.cm-ai-col { display: flex; flex-direction: column; gap: 8px; padding: 14px 12px 12px; border-radius: 20px; background: var(--bg-tertiary); border: 1px solid var(--border-light); min-width: 0; }
.cm-ai-col.here { border-color: var(--accent-fill); box-shadow: inset 0 0 0 1px var(--accent-fill); }
.cm-ai-h { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.cm-ai-dot { display: inline-grid; place-items: center; width: calc(26px*var(--k,1)); height: calc(26px*var(--k,1)); border-radius: 50%; background: var(--petrol-2); color: var(--amber); font: 300 calc(13px*var(--k,1))/1 var(--font-num); box-shadow: inset 0 0 0 1px rgba(224, 149, 90, .6); }
.cm-ai-col:nth-child(odd) .cm-ai-dot { background: var(--accent-grad); color: var(--on-accent); box-shadow: none; }
.cm-ai-h b { font: 700 calc(17px*var(--k,1))/1 var(--font-display); text-transform: uppercase; letter-spacing: .02em; color: var(--text-primary); }
.cm-ai-h i { font: 600 calc(10px*var(--k,1))/1 var(--font-num); font-style: normal; letter-spacing: .1em; text-transform: uppercase; color: var(--accent-ember); }
.cm-ai-col p { margin: 0; font: 500 calc(13.5px*var(--k,1))/1.4 var(--font-body); color: var(--text-primary); }
.cm-ai-col p small { display: block; margin-bottom: 2px; font: 600 calc(10px*var(--k,1))/1.2 var(--font-num); letter-spacing: .14em; text-transform: uppercase; color: var(--text-muted); }
.cm-ai-n { margin-top: auto; font: 400 calc(12.5px*var(--k,1))/1.3 var(--font-num); color: var(--accent-ember); }
.cm-ai-go { display: inline-flex; align-items: center; justify-content: center; gap: 6px; align-self: stretch; white-space: nowrap; min-height: 34px; padding: 0 12px; border-radius: 999px; border: 1px solid var(--edge-copper); background: transparent; color: var(--text-primary); font: 700 calc(12.5px*var(--k,1))/1 var(--font-body); cursor: pointer; }
.cm-ai-go:hover { background: var(--hover-tint); }
.cm-t-bal { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin: 18px 4px 0; padding-top: 14px; border-top: 1px solid var(--border-light); font: 500 calc(15px*var(--k,1))/1.3 var(--font-body); color: var(--text-secondary); }
.cm-t-bal b { font: 400 calc(17px*var(--k,1))/1 var(--font-num); color: var(--text-primary); }

/* пояснение в шторке «Режимы» Claude */
.cm-lead-s { margin: 0 6px 8px; font-size: calc(13.5px*var(--k,1)); }
/* «Озвучить» готовит голос — значок мягко пульсирует */
html.cm body #cl-wrap .cm-acts .cl-act.cm-busy .cm-ai { animation: cmPulse 1s ease-in-out infinite; }
@keyframes cmPulse { 50% { opacity: .35; } }