:root{
  --bg:#0f1115; --panel:#171a21; --panel2:#1e222b; --line:#2a2f3a;
  --fg:#e6e8ec; --muted:#8b92a0; --accent:#ff7a18; --accent2:#ffb347;
  --ok:#2ecc71; --warn:#f1c40f; --err:#e74c3c; --blue:#4aa3ff;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);font:15px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif}
a{color:var(--accent2);text-decoration:none}
a:hover{text-decoration:underline}
code{background:#0c0e12;padding:1px 5px;border-radius:4px;font-size:.85em}

header{display:flex;align-items:center;gap:18px;padding:12px 22px;background:#12141a;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:5}
.brand a{font-weight:700;font-size:1.15rem;color:var(--fg)}
header nav{display:flex;gap:16px;flex:1}
header nav a.new{color:var(--accent)}
.user{color:var(--muted)}
.user .logout{color:var(--muted)}

main{max-width:1100px;margin:0 auto;padding:22px}
footer{max-width:1100px;margin:24px auto;padding:14px 22px;display:flex;justify-content:space-between;color:var(--muted);font-size:.85rem;border-top:1px solid var(--line)}

h1{font-size:1.5rem;margin:.2em 0}
h3{margin:.2em 0 .6em}
.muted{color:var(--muted)}
.small{font-size:.85rem}

.flash{padding:10px 14px;border-radius:8px;margin-bottom:16px;border:1px solid var(--line)}
.flash-ok{background:#10261a;border-color:#1e5b38;color:#aef0c8}
.flash-err{background:#2a1414;border-color:#6b2626;color:#ffb9b9}
.flash-warn{background:#2a2410;border-color:#6b5a1e;color:#ffe9a8}

.page-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;gap:14px}
.project-head{margin-bottom:18px;border-bottom:1px solid var(--line);padding-bottom:8px}
.project-head h1 a{color:var(--fg)}
.subnav{display:flex;gap:18px;align-items:center;margin-top:6px}
.subnav a{color:var(--muted)} .subnav a.active{color:var(--accent2);font-weight:600}
.subnav .myrole{margin-left:auto;color:var(--muted);font-size:.85rem}

.btn{display:inline-block;background:var(--accent);color:#1a1206;font-weight:600;padding:8px 16px;border-radius:8px;border:0;cursor:pointer}
.btn:hover{text-decoration:none;background:var(--accent2)}
.btn.ghost{background:transparent;border:1px solid var(--line);color:var(--fg)}
button{font:inherit}
button[type=submit],form button:not(.link){background:var(--accent);color:#1a1206;font-weight:600;padding:8px 15px;border:0;border-radius:8px;cursor:pointer}
button[type=submit]:hover{background:var(--accent2)}
.link{background:none!important;border:0;color:var(--blue);cursor:pointer;padding:0;font:inherit}
.link.danger,.danger{color:var(--err)}

.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:16px;display:block;color:var(--fg)}
.card:hover{border-color:var(--accent);text-decoration:none}
.card-top{display:flex;justify-content:space-between;align-items:start;gap:8px}
.card h2{font-size:1.1rem;margin:0}
.card .desc{min-height:2.6em;margin:.5em 0}
.card-foot{display:flex;justify-content:space-between;align-items:center;margin-top:10px}

.progress{background:#0c0e12;border-radius:6px;height:8px;overflow:hidden;margin:8px 0}
.progress.big{height:12px}
.progress .bar{height:100%;background:linear-gradient(90deg,var(--accent),var(--accent2))}

.role{font-size:.72rem;padding:2px 8px;border-radius:20px;border:1px solid var(--line);white-space:nowrap}
.role-owner{background:#3a210a;color:var(--accent2);border-color:#7a4a12}
.role-admin{background:#2a1a3a;color:#d7a8ff;border-color:#5a3a7a}
.role-manager{background:#0a2a3a;color:#8fd6ff;border-color:#1a5a7a}
.role-tester{background:#0a3a2a;color:#8fffce;border-color:#1a7a5a}
.role-contributor{background:#22262f;color:var(--muted)}

.lc{font-size:.72rem;padding:2px 8px;border-radius:20px;border:1px solid var(--line)}
.lc-draft{color:var(--muted)} .lc-building{color:var(--warn)} .lc-live{color:var(--ok)} .lc-paused{color:var(--err)}

.panel{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:18px;margin-bottom:18px}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media(max-width:760px){.grid-2{grid-template-columns:1fr}}

label{display:block;margin:10px 0;color:var(--muted);font-size:.9rem}
input[type=text],input[type=email],input[type=password],textarea,select{
  width:100%;background:#0c0e12;border:1px solid var(--line);color:var(--fg);
  padding:9px 11px;border-radius:8px;margin-top:4px;font:inherit}
textarea.code{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.88rem}
.inline{display:inline-flex;gap:8px;align-items:center;margin:0}
.inline.wrap{flex-wrap:wrap}
.inline select,.inline input{width:auto;margin:0}
fieldset{border:1px solid var(--line);border-radius:8px;margin:12px 0;padding:10px 14px}
.radio{display:flex;gap:8px;align-items:center}
.radio input{width:auto;margin:0}
.form-card,.auth-card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:22px;max-width:520px}
.auth-card{margin:40px auto}
.auth-card button{width:100%;margin-top:8px}
.row{display:flex;gap:10px;margin-top:12px}

.tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px}
.tabs a{padding:7px 13px;border:1px solid var(--line);border-radius:8px;color:var(--muted)}
.tabs a.active{background:var(--panel2);color:var(--accent2);border-color:var(--accent)}

pre.md{white-space:pre-wrap;background:#0c0e12;border:1px solid var(--line);border-radius:8px;padding:14px;font-size:.85rem;max-height:460px;overflow:auto}
/* Отрендеренный markdown — единая читаемая разметка концептов/задач/беклога */
.rendered{font-size:.95rem;line-height:1.65;overflow-wrap:break-word}
.rendered>:first-child{margin-top:0}
.rendered>:last-child{margin-bottom:0}
.rendered h1,.rendered h2,.rendered h3,.rendered h4{line-height:1.25;margin:1.1em 0 .4em;font-weight:650}
.rendered h1{font-size:1.5rem;border-bottom:1px solid var(--line);padding-bottom:.25em}
.rendered h2{font-size:1.25rem;border-bottom:1px solid var(--line);padding-bottom:.2em}
.rendered h3{font-size:1.08rem;color:var(--accent2)}
.rendered h4{font-size:.98rem;color:var(--muted)}
.rendered p{margin:.5em 0}
.rendered ul,.rendered ol{margin:.4em 0;padding-left:1.5em}
.rendered li{margin:.2em 0}
.rendered li>ul,.rendered li>ol{margin:.2em 0}
.rendered a{color:var(--blue)}
.rendered code{background:#0c0e12;padding:1px 5px;border-radius:4px;font-size:.88em}
.rendered pre{background:#0c0e12;border:1px solid var(--line);border-radius:8px;padding:12px;overflow:auto}
.rendered pre code{background:none;padding:0}
.rendered blockquote{margin:.6em 0;padding:.2em 1em;border-left:3px solid var(--accent);color:var(--muted);background:#14161c;border-radius:0 8px 8px 0}
.rendered table{border-collapse:collapse;margin:.6em 0;width:100%;font-size:.9rem}
.rendered th,.rendered td{border:1px solid var(--line);padding:6px 10px;text-align:left}
.rendered th{background:var(--panel2)}
.rendered hr{border:0;border-top:1px solid var(--line);margin:1em 0}
.rendered img{max-width:100%}
.statline{list-style:none;padding:0;display:flex;gap:16px;flex-wrap:wrap}
.statline b{color:var(--accent2)}
.events{list-style:none;padding:0}
.events li{padding:5px 0;border-bottom:1px solid var(--line);font-size:.9rem}
.tbl{width:100%;border-collapse:collapse}
.tbl th,.tbl td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--line)}
.roles{list-style:none;padding:0}.roles li{padding:5px 0}
.report-list{list-style:none;padding:0}
.report-list li{padding:6px 0;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:12px;align-items:baseline}
.report-list li .small{white-space:nowrap}

/* Доска: столбцы flex, читаемой ширины; выделенный (наведённый/в фокусе)
   разворачивается шире, чтобы читать длинные заголовки. Лишнее — горизонтальный скролл. */
.board{display:flex;gap:12px;overflow-x:auto;align-items:flex-start;padding-bottom:6px}
.board-hint{margin:0 0 8px}
.col{flex:0 0 240px;transition:flex-basis .18s ease}
.col:hover,.col:focus-within,.col.expanded{flex-basis:380px}
@media(max-width:900px){.col{flex-basis:170px}.col:hover,.col:focus-within,.col.expanded{flex-basis:80vw}}
.cockpit{border:1px solid var(--accent)}
.cockpit-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap}
.cockpit-head h3{margin:0}
.conv-state{display:flex;flex-direction:column;align-items:flex-end;text-align:right}
.conv-state .conv-n{font-size:2.2rem;line-height:1;color:var(--accent)}
.conv-state.ok{color:var(--ok)}
.phases{list-style:none;display:flex;gap:8px;padding:0;margin:16px 0 0;overflow-x:auto}
.phases li{flex:1;min-width:110px;background:var(--panel2);border:1px solid var(--line);border-radius:8px;padding:8px 10px;position:relative}
.phases li:not(:last-child)::after{content:"→";position:absolute;right:-11px;top:50%;transform:translateY(-50%);color:var(--muted)}
.phases .ph-name{display:block;font-weight:600;font-size:.9rem}
.phases li.active{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.phases li.active .ph-name{color:var(--accent2)}
.cycle-controls{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:14px}
.cycle-controls .btn{padding:6px 12px;font-size:.85rem}
.board-bar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:12px}
.board-bar h3{margin:0}
.col{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:10px;outline:none}
.col:focus-within{border-color:var(--accent)}
/* Узкий столбец не растягивает страницу в высоту: список карточек скроллится внутри,
   у развёрнутого столбца лимит выше. */
.col-cards{max-height:58vh;overflow-y:auto;padding:2px}
.col:hover .col-cards,.col:focus-within .col-cards,.col.expanded .col-cards{max-height:74vh}
.tcard-arch{margin-top:5px}
.tcard-arch .link{font-size:.72rem;color:var(--muted)}
.col-head{font-size:.82rem;display:flex;justify-content:space-between;margin:0 0 8px;color:var(--muted)}
.col-head .cnt{background:#0c0e12;border-radius:10px;padding:0 7px}
.tcard{background:var(--panel2);border:1px solid var(--line);border-left:3px solid var(--muted);border-radius:8px;padding:9px;margin-bottom:8px}
.tcard.pr-high{border-left-color:var(--err)} .tcard.pr-med{border-left-color:var(--warn)} .tcard.pr-low{border-left-color:var(--muted)}
/* Узкий столбец: ограничиваем высоту карточки — заголовок в 3 строки, не растягиваем по вертикали.
   В развёрнутом (ховер/фокус/выбранном) столбце заголовок показываем целиком. */
.tcard-title{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;color:var(--fg);font-size:.88rem;margin-bottom:6px}
.col:hover .tcard-title,.col:focus-within .tcard-title,.col.expanded .tcard-title{-webkit-line-clamp:unset;overflow:visible}
.tcard-launch{margin-right:8px}
.tcard .btn.launch{padding:4px 10px;font-size:.78rem;border-radius:6px}
.warn-chip{font-size:.75rem;color:var(--warn);margin-bottom:5px}
.st-backlog{color:var(--muted)} .st-needs_clarification{color:var(--warn)} .st-pending{color:var(--accent2)} .st-in_progress{color:var(--blue)}
.st-awaiting_approval{color:var(--accent)} .st-done{color:var(--ok)} .st-in_prod{color:var(--accent2)}
.st-chip{padding:3px 10px;border-radius:20px;border:1px solid var(--line);font-size:.8rem}
.quickadd{border:1px dashed var(--accent)}
.quickadd-form textarea{min-height:140px;resize:vertical;line-height:1.5}
.quickadd-actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:10px}
.clarify{border:1px solid var(--warn)}
.clarify.clarify-done{border-color:var(--line)}
.chat{display:flex;flex-direction:column;gap:8px;margin:14px 0}
.chat-row{display:flex}
.chat-row.bot{justify-content:flex-start}
.chat-row.me{justify-content:flex-end}
.chat .bubble{max-width:80%;padding:9px 13px;border-radius:14px;line-height:1.45;white-space:pre-wrap;word-break:break-word}
.chat-row.bot .bubble{background:var(--panel2);border:1px solid var(--line);border-bottom-left-radius:4px}
.chat-row.me .bubble{background:var(--blue);color:#0f1115;border-bottom-right-radius:4px}
.chat .bubble-blocker{background:rgba(241,196,15,.12);border:1px solid var(--warn)}
.chat .bubble-done{background:rgba(46,204,113,.12);border:1px solid var(--ok)}
.chat .bubble .tech{margin-top:6px}
.chat .bubble .tech pre{margin:6px 0 0;padding:8px;background:var(--bg);border-radius:8px;font-size:.8rem;overflow:auto;white-space:pre-wrap}
.chat-input{display:flex;flex-direction:column;gap:10px}
.approve{border:1px solid var(--ok)}
.approve-actions{display:flex;gap:16px;align-items:center;flex-wrap:wrap;margin-top:12px}
.empty{background:var(--panel);border:1px dashed var(--line);border-radius:12px;padding:30px;text-align:center;color:var(--muted)}
details summary{cursor:pointer;color:var(--accent2);margin:8px 0}

/* Статусы агента (дашборд + страница проекта) */
.status{display:flex;align-items:center;gap:7px;margin:.5em 0;font-size:.85rem;color:var(--fg)}
.status .status-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.status .status-icon{flex:none}
.status-banner{display:flex;align-items:center;gap:12px;padding:11px 14px;margin-bottom:16px;border-radius:10px;border:1px solid var(--line);background:var(--panel2);border-left:4px solid var(--muted)}
.status-banner .status-icon{font-size:1.3rem;flex:none}
.status-banner .status-body{display:flex;flex-direction:column;flex:1;min-width:0}
.status-banner .status-label{font-size:.72rem;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.status-banner .status-text{font-size:.95rem}
.status-banner .status-link{flex:none;white-space:nowrap;font-size:.85rem;font-weight:600;color:var(--accent2);text-decoration:none}
.status-banner .status-link:hover{text-decoration:underline}
.status-working{border-left-color:var(--blue)} .status-working .status-label{color:var(--blue)}
.status-blocker{border-left-color:var(--err)} .status-blocker .status-label{color:var(--err)}
.status-result{border-left-color:var(--ok)} .status-result .status-label{color:var(--ok)}
.ev-status .status-icon{margin:0 2px}
.ev-status.status-blocker{color:#ffb9b9} .ev-status.status-result{color:#aef0c8}
.activity{margin-top:18px} .activity .ev-proj{color:var(--accent2);font-weight:600;margin:0 4px}

/* Панель бота в «Обзоре» (TASK-022): состояние + старт/пауза + прогресс */
.botpanel .bot-row{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:12px}
.bot-state{display:flex;flex-direction:column;font-weight:600}
.bot-state .small{font-weight:400}
.bot-state.run{color:var(--ok)} .bot-state.paused{color:var(--warn)} .bot-state.idle{color:var(--muted)}
.bot-controls{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-left:auto}
/* Живой стрим вывода агента (TASK-028): мини-терминал под индикатором бота */
.agent-stream{margin:12px 0;border:1px solid var(--line);border-radius:8px;background:#0c0e12}
.agent-stream>summary{cursor:pointer;padding:8px 12px;font-weight:600;user-select:none}
.agent-stream.running>summary{color:var(--ok)}
.agent-stream .stream-out{margin:0;padding:12px;border-top:1px solid var(--line);
  font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.82rem;line-height:1.4;
  white-space:pre-wrap;word-break:break-word;color:var(--fg);
  max-height:340px;overflow:auto}
.cycle-steps .cycle-controls{margin-top:10px}

/* Чат владельца с ботом (TASK-022) */
.botchat .chat-thread{display:flex;flex-direction:column;gap:8px;max-height:300px;overflow-y:auto;margin-bottom:12px}
/* Баблы по сторонам: «я» (вы) справа, «ты» (бот) слева — видно, где чья реплика. */
.botchat .chat-msg{display:flex;flex-direction:column;gap:2px;padding:8px 12px;border-radius:14px;background:var(--panel2);border:1px solid var(--line);max-width:82%}
.botchat .chat-q{align-self:flex-end;background:#11243a;border-color:#2f5d8a;border-bottom-right-radius:4px}
.botchat .chat-a{align-self:flex-start;border-bottom-left-radius:4px}
.botchat .chat-q .chat-who{align-self:flex-end}
.botchat .chat-who{font-size:.72rem;color:var(--muted)}
.botchat .chat-text{white-space:pre-wrap;word-break:break-word;line-height:1.45}
.botchat .chat-ts{align-self:flex-end}
.botchat .chat-form{display:flex;flex-direction:column;gap:8px}
.botchat .chat-form textarea{resize:vertical;line-height:1.45}
.botchat .chat-actions{display:flex;gap:10px;flex-wrap:wrap}

/* Дерево структуры проекта (TASK-022) */
.filetree{list-style:none;padding:0;margin:0;columns:2;font-size:.88rem}
.filetree li{break-inside:avoid;padding:2px 0}
.filetree li.dir{color:var(--accent2)}
.concept-peek{max-height:280px;overflow-y:auto}

/* Возврат на доработку + журнал работы по задаче (TASK-017) */
.return{border:1px solid var(--accent2)}
.return textarea{min-height:80px;resize:vertical;line-height:1.5}
.panel.log h3{margin-top:0}
.tasklog{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-direction:column;gap:14px}
.tasklog .tl{border-left:3px solid var(--line);padding:2px 0 2px 14px}
.tl-head{display:flex;gap:10px;align-items:baseline;flex-wrap:wrap}
.tl-label{font-weight:600;font-size:.85rem}
.tl-text{margin:6px 0 4px}
.tl-result{border-left-color:var(--ok)} .tl-return{border-left-color:var(--accent2)}
.tl-test{border-left-color:var(--blue)} .tl-work{border-left-color:var(--muted)}
.tl-shot{display:inline-block;margin-top:6px}
.tl-shot img{max-width:320px;max-height:240px;border:1px solid var(--line);border-radius:8px;display:block}
.tl-file{display:inline-block;margin-top:6px;color:var(--accent2)}

/* Мобильная вёрстка (TASK-027): на узком экране «Обзор» (project.html) и прочие
   страницы не должны «ехать». Главное — шапка: по умолчанию header не переносится
   (nav flex:1, .user без сжатия), на телефоне это давало горизонтальный выезд за экран.
   Здесь шапка переносится, поля сужаются, длинные пути/имена ломаются по символам. */
@media(max-width:600px){
  html,body{overflow-x:hidden}
  header{flex-wrap:wrap;gap:8px 14px;padding:10px 14px}
  header nav{order:3;flex:1 0 100%;gap:14px}
  .user{margin-left:auto}
  main{padding:16px 13px}
  footer{flex-direction:column;gap:6px;padding:14px 16px}
  .panel{padding:14px}
  /* Подменю проекта: переносим, иначе последний пункт («Команда») обрезался
     из-за overflow-x:hidden. */
  .subnav{flex-wrap:wrap;gap:8px 14px}
  .subnav .myrole{margin-left:0;flex-basis:100%}
  .bot-controls{margin-left:0;width:100%}
  .status-banner{flex-wrap:wrap}
  .status-banner .status-link,.status-banner .status-ts{flex-basis:100%}
  .filetree{columns:1}
  .filetree li,code{overflow-wrap:anywhere}
  /* Чат: правка задачи переносится, поле кода во всю ширину. */
  .chat-edit{flex-wrap:wrap;width:100%}
  .chat-taskcode{flex:1}
  /* Таблицы в markdown скроллятся, а не ломают ширину. */
  .rendered table{display:block;overflow-x:auto}
  .files-search{flex-wrap:wrap}
}
/* Правка задачи прямо из чата (TASK: чат + стрим в одном узле) */
.chat-edit{display:inline-flex;gap:6px;align-items:center}
.chat-taskcode{width:120px!important;margin:0!important;padding:6px 9px!important;font-size:.85rem}
/* Интерактивные файлы: дерево + контент + поиск */
.files-search{display:flex;gap:8px;align-items:center;margin-bottom:14px}
.files-search input{flex:1;margin:0}
.files-bar{display:flex;flex-wrap:wrap;gap:4px;align-items:center;margin-bottom:12px;font-size:.9rem}
.files-bar a{color:var(--accent2)} .files-bar a.cur{color:var(--accent);font-weight:600}
.files-bar .sep{color:var(--muted)}
.files-grid{display:grid;grid-template-columns:260px 1fr;gap:16px;align-items:start}
@media(max-width:760px){.files-grid{grid-template-columns:1fr}}
.files-tree{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:12px;max-height:72vh;overflow:auto;font-size:.9rem}
.ftree{list-style:none;padding-left:14px;margin:0}
.files-tree>.ftree{padding-left:0}
.ftree li{margin:2px 0}
.ftree summary{cursor:pointer;color:var(--accent2)}
.ftree a.fnode{color:var(--fg)} .ftree a.cur{color:var(--accent);font-weight:600}
.files-content{min-height:220px}
.search-res{list-style:none;padding:0}
.search-res li{padding:6px 0;border-bottom:1px solid var(--line)}

/* ── Плавающий чат с ботом (глобальный виджет, доступен в любом окне проекта) ── */
.fchat{position:fixed;right:20px;bottom:20px;z-index:50}
.fchat-launch{width:54px;height:54px;border-radius:50%;font-size:24px;line-height:1;
  background:var(--accent);color:#1a1206;border:0;cursor:pointer;box-shadow:0 6px 20px rgba(0,0,0,.45);padding:0}
.fchat-launch:hover{background:var(--accent2)}
.fchat.open .fchat-launch{display:none}
/* Атрибут hidden должен реально прятать: иначе display:flex ниже перебивает
   UA-правило [hidden]{display:none} (равная специфичность) и панель/тег-привязка
   «приклеиваются» — не убрать. Делаем hidden авторитетным внутри виджета. */
.fchat [hidden]{display:none!important}
.fchat-panel{position:fixed;right:20px;bottom:20px;display:flex;flex-direction:column;
  width:380px;height:520px;min-width:300px;min-height:300px;max-width:96vw;max-height:90vh;
  background:var(--panel);border:1px solid var(--line);border-radius:14px;
  box-shadow:0 12px 40px rgba(0,0,0,.55);overflow:hidden;resize:both}
.fchat-head{display:flex;align-items:center;gap:8px;padding:10px 12px;background:var(--panel2);
  border-bottom:1px solid var(--line);cursor:move;user-select:none}
.fchat-title{font-weight:600;font-size:.95rem}
.fchat-ctx{font-size:.72rem;color:var(--accent2);background:#3a210a;border:1px solid #7a4a12;
  border-radius:20px;padding:1px 8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:150px}
.fchat-min{margin-left:auto;background:transparent!important;border:0;color:var(--muted)!important;
  font-size:18px;cursor:pointer;padding:0 6px;font-weight:700}
.fchat-body{flex:1;overflow-y:auto;padding:12px;display:flex;flex-direction:column;gap:8px}
/* Реплики — баблы по сторонам: «я» (вы) справа, «ты» (бот) слева, чтобы сразу
   видеть, где чья реплика. Ширина бабла ограничена, поэтому сторона читается. */
.fchat-body .chat-msg{display:flex;flex-direction:column;gap:2px;padding:8px 11px;border-radius:14px;
  background:var(--panel2);border:1px solid var(--line);max-width:82%}
.fchat-body .chat-q{align-self:flex-end;background:#11243a;border-color:#2f5d8a;border-bottom-right-radius:4px}
.fchat-body .chat-a{align-self:flex-start;border-bottom-left-radius:4px}
.fchat-body .chat-q .chat-who{align-self:flex-end}
.fchat-body .chat-who{font-size:.7rem;color:var(--muted)}
.fchat-body .chat-text{white-space:pre-wrap;word-break:break-word;line-height:1.45}
.fchat-body .chat-pending{opacity:.55}
.fchat-empty{color:var(--muted);font-size:.9rem;margin:auto;text-align:center;padding:0 12px}
.fchat-form{display:flex;flex-direction:column;gap:7px;padding:10px;border-top:1px solid var(--line)}
.fchat-target{display:flex;align-items:center;gap:6px;font-size:.75rem;color:var(--accent2)}
.fchat-target button{background:transparent!important;border:0;color:var(--muted)!important;cursor:pointer;padding:0 2px;font-weight:700}
.fchat-form textarea{resize:none;line-height:1.4;min-height:44px}
.fchat-actions{display:flex;align-items:center;gap:10px}
.fchat-actions button{padding:7px 14px}

/* ── Живой индикатор агента: работает / ждёт / пауза (карточка + страница) ── */
.agent-badge{display:inline-flex;align-items:center;gap:7px;font-size:.85rem;font-weight:600;flex-direction:row;margin:.4em 0}
.agent-badge .aphase{font-weight:400}
.agent-badge.run{color:var(--ok)} .agent-badge.paused{color:var(--warn)} .agent-badge.idle{color:var(--muted)}
.adot{width:9px;height:9px;border-radius:50%;background:var(--muted);flex:none}
.agent-badge.run .adot{background:var(--ok);animation:apulse 1.4s infinite}
.agent-badge.paused .adot{background:var(--warn)}
@keyframes apulse{0%{box-shadow:0 0 0 0 rgba(46,204,113,.55)}70%{box-shadow:0 0 0 7px rgba(46,204,113,0)}100%{box-shadow:0 0 0 0 rgba(46,204,113,0)}}