: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;
  /* Семантические поверхности (тема переопределяет их ниже) */
  --input-bg:#0c0e12; --header-bg:#12141a; --code-bg:#0c0e12; --log-bg:#0b0d11; --log-fg:#cdd3dc;
  --qbubble-bg:#11243a; --qbubble-line:#2f5d8a;
}
/* Светлая тема Кузницы (переключатель в шапке, выбор запоминается). */
html[data-theme=light]{
  --bg:#f5f7fa; --panel:#ffffff; --panel2:#eef1f6; --line:#e2e6ee;
  --fg:#1b1f27; --muted:#5f6772; --accent:#f4710f; --accent2:#c96510;
  --ok:#1f9d57; --warn:#c9960a; --err:#d33b48; --blue:#1d74c4;
  --input-bg:#ffffff; --header-bg:#ffffff; --code-bg:#eef1f6; --log-bg:#f4f6fa; --log-fg:#2c333d;
  --qbubble-bg:#e7f0fb; --qbubble-line:#bcd5f0;
}
html[data-theme=light] .flash-ok{background:#e3f6ea;border-color:#bfe6cd;color:#1c7a44}
html[data-theme=light] .flash-err{background:#fdebec;border-color:#f5c6cb;color:#b32430}
html[data-theme=light] .flash-warn{background:#fdf4dd;border-color:#ecdcab;color:#8a6d12}
html[data-theme=light] .role-owner{background:#fdeedd;color:#b5641a;border-color:#e9c79a}
html[data-theme=light] .role-admin{background:#f1e8fb;color:#6b3fa0;border-color:#dcc9f0}
html[data-theme=light] .role-manager{background:#e4f1fb;color:#1d6fa5;border-color:#bcdcf0}
html[data-theme=light] .role-tester{background:#e2f6ee;color:#1a7a5a;border-color:#bce6d3}
html[data-theme=light] .role-contributor{background:#eef1f6;color:#5f6772;border-color:#e2e6ee}
*{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:var(--code-bg);padding:1px 5px;border-radius:4px;font-size:.85em}

header{display:flex;align-items:center;gap:18px;padding:12px 22px;background:var(--header-bg);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);display:flex;align-items:center;gap:10px}
.user .logout{color:var(--muted)}
.theme-toggle{background:transparent!important;border:1px solid var(--line);color:var(--fg)!important;
  border-radius:8px;width:34px;height:32px;padding:0;cursor:pointer;font-size:15px;line-height:1;flex:none}
.theme-toggle:hover{border-color:var(--accent)}

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:var(--input-bg);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)}
.lc-run{color:var(--ok)}

.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:var(--input-bg);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:var(--code-bg);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:var(--code-bg);padding:1px 5px;border-radius:4px;font-size:.88em}
.rendered pre{background:var(--code-bg);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:var(--input-bg);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[hidden]{display:none!important}  /* пустой статус не показываем (display:flex перебивал hidden) */
.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:var(--log-bg)}
.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:var(--qbubble-bg);border-color:var(--qbubble-line);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:var(--qbubble-bg);border-color:var(--qbubble-line);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-time{margin-left:6px;opacity:.7;font-variant-numeric:tabular-nums}
.fchat-body .chat-text{white-space:pre-wrap;word-break:break-word;line-height:1.45}
.fchat-body .chat-pending{opacity:.55}
.fchat-body .chat-typing .chat-text{color:var(--muted);font-style:italic}
.fchat-body .chat-typing{opacity:.8}
.fchat-empty{color:var(--muted);font-size:.9rem;margin:auto;text-align:center;padding:0 12px}

/* ── Реплаи чата (TASK-014): цитата в ленте, кнопка «Ответить», панель над вводом ── */
/* Цитата над текстом ответа — подчинённый блок: левый бордюр accent, фон panel2. */
.fchat-body .chat-quote{display:flex;flex-direction:column;gap:1px;margin-bottom:4px;
  padding:4px 8px;background:var(--panel2);border-left:3px solid var(--accent);border-radius:6px;
  cursor:pointer;max-width:100%}
.fchat-body .chat-quote-who{font-size:.68rem;color:var(--muted)}
.fchat-body .chat-quote-text{font-size:.78rem;color:var(--fg);overflow:hidden;text-overflow:ellipsis;
  white-space:nowrap}
.fchat-body .chat-quote-missing{cursor:default;border-left-color:var(--line)}
.fchat-body .chat-quote-missing .chat-quote-text{color:var(--muted);font-style:italic}
/* короткая подсветка оригинала при переходе по цитате */
.fchat-body .chat-msg-hl{animation:fchatHl 1.6s ease}
@keyframes fchatHl{0%{box-shadow:0 0 0 2px var(--accent)}100%{box-shadow:0 0 0 2px transparent}}
/* компактная неброская кнопка «Ответить» */
.fchat-body .chat-reply-btn{align-self:flex-start;margin-top:2px;background:transparent!important;
  border:0;color:var(--muted)!important;cursor:pointer;font-size:.7rem;padding:1px 2px}
.fchat-body .chat-reply-btn:hover{color:var(--accent)!important}
.fchat-body .chat-q .chat-reply-btn{align-self:flex-end}
/* панель цитаты над полем ввода (в зоне формы — видно над клавиатурой) */
.fchat-reply{display:flex;align-items:center;gap:8px;padding:5px 8px;
  background:var(--panel2);border-left:3px solid var(--accent);border-radius:6px}
.fchat-reply .fchat-reply-q{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.fchat-reply .fchat-reply-who{font-size:.68rem;color:var(--muted)}
.fchat-reply .fchat-reply-text{font-size:.78rem;color:var(--fg);overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
.fchat-reply button{background:transparent!important;border:0;color:var(--muted)!important;
  cursor:pointer;padding:0 2px;font-weight:700;flex:none}
.fchat-reply button:hover{color:var(--accent)!important}
.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;
  max-height:min(calc(6 * 1.4em + 20px), 38vh);overflow-y:auto;
  overflow-wrap:break-word;transition:height .12s ease}
.fchat-actions{display:flex;align-items:center;gap:10px}
.fchat-actions button[type=submit]{padding:7px 14px}
.fchat-actions button[type=submit]:disabled{opacity:.5;cursor:default}

/* ── Вложения чата (TASK-005): скрепка, превью до отправки, плашки в треде ── */
.fchat-attach{background:transparent!important;border:1px solid var(--line);color:var(--accent)!important;
  border-radius:8px;padding:5px 9px;font-size:16px;cursor:pointer;line-height:1}
.fchat-attach:hover{border-color:var(--accent)}
.fchat-attach:disabled{opacity:.5;cursor:default}
.fchat-actions .att-err{color:var(--err)}
/* ── Плеер аудио-вложений в треде (TASK-022, история) ── */
.chat-att audio{max-width:240px;height:34px;display:block}
.att-audio-name{font-size:.75rem;color:var(--muted)!important;align-self:center;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:160px}
.fchat-previews{display:flex;flex-wrap:wrap;gap:10px;margin:2px 0}
/* плашка вложения (превью до отправки и файл в треде) */
.att-chip{display:inline-flex;align-items:center;gap:6px;max-width:220px;
  background:var(--panel2);border:1px solid var(--line);border-radius:8px;padding:4px 8px;
  font-size:.8rem;color:var(--fg)}
.att-chip .att-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:160px}
.att-chip .att-size{color:var(--muted);flex:none}
/* превью картинки в поле ввода — показываем ЦЕЛИКОМ (object-fit:contain), без обрезки */
.att-card{position:relative;display:inline-block;line-height:0;background:var(--input-bg);
  border:1px solid var(--line);border-radius:10px;overflow:hidden}
.att-card img{display:block;height:96px;width:auto;max-width:220px;object-fit:contain}
.att-card .att-del{position:absolute;top:4px;right:4px;width:22px;height:22px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;line-height:1;font-size:12px;
  background:rgba(0,0,0,.6)!important;color:#fff!important}
.att-card .att-del:hover{background:var(--err)!important;color:#fff!important}
.att-del{background:transparent!important;border:0;color:var(--muted)!important;cursor:pointer;
  font-size:13px;padding:0 2px;flex:none}
.att-del:hover{color:var(--err)!important}
/* вложения внутри реплики треда */
.chat-att{display:flex;flex-wrap:wrap;gap:16px;margin-top:6px}
.chat-att img{max-width:160px;max-height:160px;border-radius:8px;border:1px solid var(--line);display:block;cursor:zoom-in}
.chat-att .att-chip{text-decoration:none}

/* ── drag&drop в поле чата + лайтбокс увеличения (TASK-017) ── */
.fchat-form.fchat-dragover{outline:2px dashed var(--accent);outline-offset:-4px}
/* оверлей монтируется в document.body — z-index заведомо выше панелей чата (z-index:50) */
.fchat-lightbox{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;
  justify-content:center;background:rgba(0,0,0,.8)}
.fchat-lightbox img{max-width:90vw;max-height:90vh;border-radius:8px;border:1px solid var(--line)}
.fchat-lightbox-close{position:absolute;top:16px;right:16px;background:transparent!important;
  border:1px solid var(--line);color:var(--accent)!important;border-radius:8px;
  padding:5px 9px;font-size:16px;cursor:pointer;line-height:1}
.fchat-lightbox-close:hover{border-color:var(--accent)}

/* ── Встроенный (docked) чат на дашборде «Обзор»: две колонки рядом с panel бота ── */
.overview-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,400px);gap:16px;align-items:start}
@media(max-width:900px){.overview-grid{grid-template-columns:1fr}}
/* docked: чат в обычном потоке, всегда открыт, без плавающей геометрии/ресайза.
   История скроллится внутри .fchat-body, панель ограничена по высоте — дашборд не растягивается. */
.fchat--docked{position:static;z-index:auto}
.fchat--docked .fchat-panel{position:static;width:100%;height:auto;min-width:0;min-height:0;
  max-width:none;max-height:70vh;resize:none;box-shadow:none}
.fchat--docked .fchat-launch,.fchat--docked .fchat-min{display:none}
.fchat--docked .fchat-head{cursor:default}

/* ── «Обзор» как единая CLI-консоль: шапка + живой тейл «что делает бот» + чат-оркестратор ── */
.console{display:flex;flex-direction:column;gap:12px}
.console-bar{display:flex;align-items:center;flex-wrap:wrap;gap:8px 12px}
.console-bar .console-spacer{flex:1 1 12px}
.console-bar .bot-controls{display:inline-flex;gap:6px}
.btn.small,button.small{padding:4px 10px;font-size:.82rem}
.console-activity{border:1px solid var(--line);border-radius:10px;background:var(--log-bg);overflow:hidden}
.console-activity-head{display:flex;justify-content:space-between;gap:8px;padding:6px 11px;
  background:var(--panel2);border-bottom:1px solid var(--line)}
.console-activity.running .console-activity-head{color:var(--ok)}
.console-activity .stream-out{margin:0;max-height:210px;overflow:auto;padding:10px 12px;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.78rem;line-height:1.5;
  white-space:pre-wrap;word-break:break-word;color:var(--log-fg);background:var(--log-bg)}
/* Чат интегрирован в блок «Обзора» как главный элемент: без внутренней рамки и
   собственной шапки — внешняя рамка одна (.console = .panel), внутри только тонкий
   разделитель перед полем ввода. Так нет нагромождения бордеров. */
.fchat--console .fchat-panel{max-height:none;border:0;border-radius:0;background:transparent;box-shadow:none}
.fchat--console .fchat-head{display:none}
.fchat--console .fchat-body{min-height:340px;max-height:54vh;padding:2px 0 8px}
.fchat--console .fchat-form{padding:10px 0 0}
.console-status{padding:7px 11px;border:1px solid var(--line);border-radius:8px;font-size:.86rem;background:var(--panel2)}
.console-status.st-result{border-color:var(--ok)}
.console-status.st-blocker{border-color:var(--err)}
/* Статус проекта строкой в ленте чата (раз в 3 мин) — на всю ширину, пунктир */
.fchat-body .chat-status{align-self:stretch;background:var(--panel2);
  border:1px dashed var(--line);border-radius:10px}
.fchat-body .chat-status .chat-who{color:var(--accent2)}
.fchat-body .chat-status .chat-text{white-space:pre-wrap;font-size:.82rem;color:var(--muted)}

/* ── Живой индикатор агента: работает / ждёт / пауза (карточка + страница) ── */
.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)}}

/* ── Эскалация ревью (нужно решение владельца) — выделяем заметно ── */
.clarify.clarify-esc{border-color:var(--err);box-shadow:0 0 0 1px var(--err) inset}
.clarify.clarify-esc h3{color:var(--err)}
.chat .bubble-esc{background:rgba(231,76,60,.12);border:1px solid var(--err)}
.esc-stage{display:inline-block;font-size:.7rem;font-weight:700;text-transform:uppercase;
  letter-spacing:.03em;color:var(--err);background:rgba(231,76,60,.15);
  border:1px solid var(--err);border-radius:6px;padding:1px 7px;margin-right:6px}
.warn-chip.esc-chip{color:var(--err);font-weight:600}

/* Разбор по циклу на странице задачи: чипы фаз + сам concept-task документ */
.cycle-doc .phase-chips{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 4px}
.phase-chip{font-size:12px;font-weight:600;color:var(--accent2);
  background:rgba(255,122,24,.12);border:1px solid var(--accent);
  border-radius:999px;padding:2px 10px}
.cycle-doc-body{background:var(--panel2);border:1px solid var(--line);
  border-radius:10px;padding:14px 16px;margin-top:10px;max-height:560px;overflow:auto}
.cycle-doc-body h1{font-size:18px;margin:.2em 0 .4em}
.cycle-doc-body h2{font-size:16px;margin:1em 0 .3em;padding-top:.6em;
  border-top:1px solid var(--line);color:var(--accent2)}
.cycle-doc-body h2:first-child{border-top:0;padding-top:0}
.cycle-doc-body h3{font-size:14px;margin:.8em 0 .2em;color:var(--fg)}
.cycle-doc-body ul{margin:.3em 0 .6em;padding-left:1.2em}
.cycle-doc-body code{background:rgba(255,255,255,.06);padding:1px 5px;border-radius:5px}

/* --- Панель секретов (TASK-013): карточки с типом/сервисом/статусом --- */
.secret-cards{display:flex;flex-direction:column;gap:10px;margin:10px 0}
.secret-card{border:1px solid var(--line);border-radius:8px;padding:10px 12px;background:var(--panel2)}
.secret-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.secret-key{font-size:.9em}
.secret-val{margin-left:auto}
.secret-badge{font-size:.72rem;padding:2px 9px;border-radius:20px;border:1px solid var(--line)}
.secret-badge.st-ok{color:var(--ok);border-color:var(--ok)}
.secret-badge.st-fail{color:var(--err);border-color:var(--err)}
.secret-badge.st-unknown{color:var(--muted);border-color:var(--line)}
.secret-meta{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:6px}
.secret-chip{font-size:.72rem;padding:2px 8px;border-radius:6px;border:1px solid var(--line);color:var(--muted)}
.secret-checked{margin-left:auto}
.secret-desc{margin:6px 0 0}
.secret-error{margin:6px 0 0;color:var(--err)}
.secret-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:8px}
.secret-add-entry{display:flex;flex-direction:column;gap:6px;margin-top:12px;align-items:flex-start}
.secret-add{display:flex;flex-direction:column;gap:8px;margin-top:12px}
.secret-add label{display:flex;flex-direction:column;gap:3px}
.secret-add input,.secret-add select{padding:6px 9px;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--fg)}