/* ═══ Командный центр · тёплый пастельный минимализм (Apple-clean) ═══ */
:root {
  /* Тёплая пастельная палитра */
  --bg0: #f5f1ea;        /* страница — тёплая слоновая кость */
  --bg1: #ece5d8;        /* глубже */
  --panel: #ffffff;      /* карточки */
  --glass: rgba(255, 255, 255, 0.72);

  --cyan:  #b3903a;      /* ПЕРВИЧНЫЙ акцент — благородное золото (была «золотая линия» 31.07) */
  --orange:#c08a63;      /* тёплая терракота */
  --green: #86a980;      /* пастельно-зелёный (успех/актив) */
  --blue:  #8298ac;      /* пыльно-голубой */

  --text:  #33302b;      /* тёплый графит */
  --muted: #8b8375;      /* приглушённый тауп */
  --line:  #e6dfd2;      /* мягкая линия-волосок */

  --shadow: 0 1px 2px rgba(60, 50, 35, 0.05), 0 10px 30px rgba(60, 50, 35, 0.05);
  --shadow-sm: 0 1px 2px rgba(60, 50, 35, 0.06);
  --sans: -apple-system, "SF Pro Display", "SF Pro Text", "Segoe UI", Roboto, sans-serif;
  --mono: ui-monospace, "SF Mono", "Cascadia Code", "Consolas", monospace;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { height: 100%; }
body {
  font-family: var(--sans);
  color: var(--text); background: var(--bg0); overflow: hidden;
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
  letter-spacing: -0.01em;
}

/* Фон: очень мягкая тёплая заливка, без сеток и сканлайнов */
.bg {
  position: fixed; inset: 0; z-index: -2;
  background:
    radial-gradient(1200px 800px at 82% -8%, rgba(192, 138, 99, 0.06), transparent 60%),
    radial-gradient(1000px 700px at 5% 108%, rgba(125, 154, 134, 0.06), transparent 60%),
    var(--bg0);
}
.scan { display: none; }

#app { display: flex; flex-direction: column; height: 100vh; }
.layout { display: flex; flex: 1; min-height: 0; }

/* ── Навигация (рейл) ── */
.rail {
  width: 96px; flex-shrink: 0; display: flex; flex-direction: column; align-items: center;
  padding: 20px 0; gap: 8px;
  background: #ece3d1; border-right: 1px solid #dcd1bd;
  box-shadow: 1px 0 14px rgba(60, 50, 35, 0.05);
}
.logo img { width: 44px; height: 44px; border-radius: 12px; margin-bottom: 16px; box-shadow: var(--shadow-sm); }
.rail nav { display: flex; flex-direction: column; gap: 4px; width: 100%; align-items: center; }
.rbtn {
  width: 74px; height: 58px; border: none; background: transparent; color: var(--muted);
  border-radius: 14px; cursor: pointer; display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 5px; transition: .2s ease;
}
.rbtn svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.6;
  stroke-linecap: round; stroke-linejoin: round; }
.rbtn span { font-size: 10.5px; letter-spacing: 0; font-weight: 500; }
/* Свой живой цвет для каждой кнопки — подсветка на ховере и в активном */
.rbtn { --hc: #b3903a; }
/* цвета — по data-tab, чтобы не зависеть от порядка кнопок (Офис переехал на 2-ю позицию, Федор 21.08) */
.rbtn[data-tab="overview"] { --hc: #5f9e77; }       /* Обзор — зелень */
.rbtn[data-tab="office"]   { --hc: #c8a34d; }       /* Офис — золото */
.rbtn[data-tab="projects"] { --hc: #5b93c4; }       /* Проекты — голубой */
.rbtn[data-tab="personal"] { --hc: #d68e5c; }       /* Личное — терракота */
.rbtn[data-tab="chat"]     { --hc: #a87fc0; }       /* Чат — лаванда */
.rbtn[data-tab="concept"]  { --hc: #3fa596; }       /* Карта — бирюза */
.rbtn[data-tab="brain"]    { --hc: #d47f83; }       /* Мозг — роза */
.rbtn:hover { color: var(--hc); background: color-mix(in srgb, var(--hc) 18%, transparent); }
.rbtn.active { color: #fff; background: var(--hc); box-shadow: 0 4px 12px color-mix(in srgb, var(--hc) 40%, transparent); }

.rail-foot { margin-top: auto; }
.pulse { width: 8px; height: 8px; border-radius: 50%; background: var(--green); display: block; }

.main { flex: 1; display: flex; flex-direction: column; min-width: 0; }

/* ── Верхняя панель — на всю ширину, иконка + название ── */
.topbar {
  display: flex; align-items: center; gap: 14px;
  padding: 13px 26px; border-bottom: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.4); backdrop-filter: blur(10px);
  flex-shrink: 0;
}
.tb-logo { width: 32px; height: 32px; border-radius: 9px; box-shadow: var(--shadow-sm); }
.tb-title { font-size: 17px; font-weight: 700; letter-spacing: 0.5px;
  background: linear-gradient(100deg, #5f8168, #6d8aa3, #b47a52, #9670ac, #5f8168);
  background-size: 300% auto; -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
  animation: titleflow 8s linear infinite; }
@keyframes titleflow { 0% { background-position: 0% center; } 100% { background-position: 300% center; } }
.tb-title.shimmer {
  background: linear-gradient(100deg, #9c7d45 0%, #d9c088 22%, #f5ecd0 36%, #cbab6a 50%, #9c7d45 64%, #d9c088 82%, #f5ecd0 100%);
  background-size: 200% auto; -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
  animation: shimmermove 6s linear infinite;
}
@keyframes shimmermove { 0% { background-position: 0% center; } 100% { background-position: 200% center; } }
.tb-sub { font-size: 12px; color: var(--muted); letter-spacing: 0; margin-top: 3px; font-weight: 500; }
.tb-meta { display: flex; align-items: center; gap: 28px; }
.meta-cell { display: flex; flex-direction: column; align-items: flex-end; }
.meta-cell b { font-size: 16px; font-weight: 600; font-variant-numeric: tabular-nums; letter-spacing: -0.01em; }
.meta-cell small { font-size: 9.5px; color: var(--muted); letter-spacing: 1.2px; margin-top: 2px; text-transform: uppercase; }
.online { display: flex; align-items: center; gap: 7px; font-size: 11px; letter-spacing: .5px;
  font-weight: 500; color: var(--green); }
.online i { width: 7px; height: 7px; border-radius: 50%; background: var(--green); }

/* ── Контент ── */
.content { flex: 1; overflow-y: auto; padding: 16px 34px 40px; }
.content::-webkit-scrollbar { width: 10px; }
.content::-webkit-scrollbar-thumb { background: rgba(60,50,35,.14); border-radius: 6px; border: 3px solid var(--bg0); }
.tab.hidden { display: none; }
.head-row { display: flex; align-items: baseline; gap: 14px; margin-bottom: 22px; }
h1 { font-size: 26px; font-weight: 600; letter-spacing: -0.02em; }
h2 { font-size: 12px; color: var(--muted); text-transform: uppercase; letter-spacing: 1.4px;
  font-weight: 600; margin-bottom: 14px; display: flex; align-items: center; gap: 8px; }
.dot { width: 7px; height: 7px; border-radius: 50%; }
.dot.cyan { background: var(--cyan); }
.dot.orange { background: var(--orange); }
.dot.green { background: var(--green); }
.muted { color: var(--muted); font-size: 13px; }
code { font-family: var(--mono); background: rgba(60,50,35,.06); padding: 2px 6px; border-radius: 5px; font-size: 12px; color: var(--text); }

/* Карточка */
.glass {
  background: var(--panel); border: 1px solid var(--line); border-radius: 18px; padding: 24px;
  box-shadow: var(--shadow);
}

/* ── ОБЗОР: герой с кольцом ── */
.hero { display: flex; align-items: center; gap: 44px; margin-bottom: 30px; padding: 8px 6px; }
.reactor { position: relative; width: 260px; height: 260px; flex-shrink: 0; }
.reactor svg { width: 100%; height: 100%; }
.reactor .ring { transform-origin: 150px 150px; }
.reactor .ticks circle { fill: none; stroke: var(--line); stroke-width: 2; stroke-dasharray: 1.5 8; }
.arc { fill: none; stroke-width: 6; stroke-linecap: round; }
.arc.cyan   { stroke: var(--cyan);   stroke-dasharray: 300 460; }
.arc.orange { stroke: var(--orange); stroke-dasharray: 120 520; opacity: .55; }
.arc.green  { stroke: var(--green);  stroke-dasharray: 70 400; opacity: .5; }
.core-glass { fill: #fff; stroke: var(--line); stroke-width: 1.5; }
.core-dot { fill: var(--cyan); }
.spin-cw, .spin-ccw, .spin-cw.fast, .spin-cw.slow { animation: none; }
.reactor-center { position: absolute; inset: 0; display: flex; flex-direction: column;
  align-items: center; justify-content: center; pointer-events: none; }
.reactor-center b { font-size: 56px; font-weight: 600; line-height: 1; letter-spacing: -0.03em;
  font-variant-numeric: tabular-nums; }
.reactor-center small { font-size: 10px; letter-spacing: 2px; color: var(--muted); margin-top: 8px; text-transform: uppercase; }

.readouts { flex: 1; display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.readout { background: var(--panel); border: 1px solid var(--line); border-radius: 16px;
  padding: 18px 20px; box-shadow: var(--shadow-sm); }
.readout .v { font-size: 28px; font-weight: 600; font-variant-numeric: tabular-nums; letter-spacing: -0.02em; }
.readout.g .v { color: var(--green); } .readout.o .v { color: var(--orange); }
.readout .k { font-size: 10.5px; letter-spacing: 1px; color: var(--muted); margin-top: 5px; text-transform: uppercase; }

.grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.note-body { white-space: pre-wrap; font-size: 13.5px; line-height: 1.7;
  max-height: 320px; overflow-y: auto; color: #575047; }
.list { list-style: none; }
.list li { padding: 9px 0; border-bottom: 1px solid var(--line);
  font-size: 14px; cursor: pointer; color: var(--text); transition: .15s; display: flex; gap: 10px; }
.list li:before { content: "›"; color: var(--muted); }
.list li:hover { color: var(--cyan); padding-left: 4px; }
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chip { background: rgba(60,50,35,.04); border: 1px solid var(--line); border-radius: 20px;
  padding: 5px 13px; font-size: 12px; color: var(--muted); }

/* ── Ввод ── */
input, select, textarea {
  background: #fff; border: 1px solid var(--line); color: var(--text);
  padding: 11px 14px; border-radius: 11px; font-size: 14px; font-family: inherit; outline: none;
  transition: .15s;
}
input:focus, textarea:focus, select:focus { border-color: var(--cyan); box-shadow: 0 0 0 3px rgba(201,162,39,.16); }
.compose { display: flex; gap: 10px; align-items: center; margin-bottom: 18px; }
.compose input { flex: 1; }
textarea { width: 100%; min-height: 340px; resize: vertical; line-height: 1.7; }
.compose-foot { display: flex; align-items: center; gap: 14px; margin-top: 14px; }
button {
  background: var(--cyan); border: none; color: #fff;
  padding: 11px 20px; border-radius: 11px; cursor: pointer; font-size: 14px; font-weight: 600;
  letter-spacing: 0; transition: .16s ease;
}
button:hover { filter: brightness(1.05); transform: translateY(-1px); box-shadow: var(--shadow-sm); }
button:active { transform: translateY(0); }
button.ghost { background: rgba(60,50,35,.05); color: var(--muted); }
button.ghost:hover { background: rgba(60,50,35,.09); color: var(--text); }

/* ── Проекты ── */
.projects { display: grid; grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)); gap: 16px; }
.pj { position: relative; background: var(--panel); border: 1px solid var(--line); border-radius: 18px;
  padding: 20px; transition: .18s ease; overflow: hidden; box-shadow: var(--shadow-sm); }
.pj:hover { transform: translateY(-2px); box-shadow: var(--shadow); }
.pj:before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--cyan); }
.pj.planned:before { background: var(--blue); } .pj.active:before { background: var(--green); }
.pj.paused:before { background: var(--orange); } .pj.done:before { background: var(--muted); }
.pj h3 { font-size: 16px; font-weight: 600; margin-bottom: 10px; padding-right: 24px; letter-spacing: -0.01em; }
.pj .st { display: inline-block; font-size: 10px; letter-spacing: .5px; font-weight: 600;
  text-transform: uppercase; padding: 3px 10px; border-radius: 20px; margin-bottom: 10px; }
.st.active { background: rgba(134,169,128,.16); color: #8a6d1f; }
.st.planned { background: rgba(130,152,172,.16); color: #566a7d; }
.st.paused { background: rgba(192,138,99,.16); color: #97633f; }
.st.done { background: rgba(60,50,35,.06); color: var(--muted); }
.pj .del { position: absolute; top: 16px; right: 14px; background: none; color: var(--muted);
  padding: 0; width: 22px; height: 22px; font-size: 18px; line-height: 1; }
.pj .del:hover { color: var(--orange); transform: none; background: none; box-shadow: none; }
.pj-views { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.pj-view { background: rgba(60,50,35,.05); color: var(--text); font-size: 12px; font-weight: 500;
  padding: 6px 12px; border-radius: 9px; }
.pj-view:hover { background: var(--cyan); color: #fff; }
.pj.expandable { cursor: pointer; }
.pj-summary { display: none; margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--line);
  font-size: 13px; line-height: 1.65; color: var(--text); white-space: pre-line; }
.pj.expanded .pj-summary { display: block; }
.pj-more { display: inline-block; margin-top: 12px; font-size: 12px; color: var(--muted); font-weight: 600; }
.pj-more::before { content: "Подробнее \25be"; }
.pj.expanded .pj-more::before { content: "Свернуть \25b4"; }

/* ── Командный центр проекта (профессиональный табличный вид) ── */
.cc-back{display:inline-flex;align-items:center;gap:6px;color:var(--muted);text-decoration:none;font-size:13px;border:1px solid var(--line);padding:7px 14px;border-radius:8px;margin-bottom:14px;cursor:pointer;background:var(--panel)}
.cc-back:hover{color:var(--text);border-color:var(--muted)}
.cc-hero{background:#17170f;color:#fff;border-radius:14px;padding:20px 24px;margin-bottom:16px;display:flex;justify-content:space-between;align-items:flex-start;gap:20px;flex-wrap:wrap}
.cc-hero h2{font-size:19px;margin:0 0 6px;letter-spacing:-.01em}
.cc-hero .off{color:#c9c9c2;font-size:13px;max-width:640px;line-height:1.5}
.cc-hmeta{display:flex;flex-direction:column;gap:8px;align-items:flex-end;font-size:12px;color:#c9c9c2;white-space:nowrap}
.cc-goal{background:rgba(31,122,77,.28);border:1px solid rgba(80,200,140,.45);color:#c7f0d8;padding:4px 12px;border-radius:999px;font-weight:600}
.cc-sync{color:#8f8f88;font-size:11px}
.cc-kpis{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;margin-bottom:14px}
.cc-kpi{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:13px 15px}
.cc-kpi .num{font-size:23px;font-weight:800;letter-spacing:-.02em;line-height:1.1}
.cc-kpi .lbl{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.03em;margin-top:3px}
.cc-goalbar{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:14px 16px;margin-bottom:16px}
.cc-goalbar .gt{display:flex;justify-content:space-between;gap:10px;font-size:13px;margin-bottom:9px;flex-wrap:wrap}
.cc-track{height:10px;background:rgba(0,0,0,.06);border-radius:999px;overflow:hidden}
.cc-fill{height:100%;background:linear-gradient(90deg,#1f7a4d,#57c98a);border-radius:999px;transition:width .4s}
@media(max-width:900px){.cc-kpis{grid-template-columns:repeat(3,1fr)}}
@media(max-width:520px){.cc-kpis{grid-template-columns:repeat(2,1fr)}}
.cc-nav{display:flex;gap:2px;border-bottom:2px solid var(--line);margin-bottom:16px;flex-wrap:wrap}
.cc-tab{background:none;border:none;border-bottom:2px solid transparent;margin-bottom:-2px;padding:10px 16px;cursor:pointer;font-weight:600;font-size:13px;color:var(--muted)}
.cc-tab:hover{color:var(--text)}
.cc-tab.active{color:var(--text);border-bottom-color:#17170f}
.cc-panel{display:none}.cc-panel.active{display:block}
.cc-sec{background:var(--panel);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.cc-sec-h{padding:12px 16px;border-bottom:1px solid var(--line);font-weight:600;font-size:14px;display:flex;justify-content:space-between;align-items:center}
.cc-table{width:100%;border-collapse:collapse;font-size:13px}
.cc-table th{text-align:left;padding:10px 16px;background:rgba(0,0,0,.03);color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.04em;font-weight:700;border-bottom:1px solid var(--line)}
.cc-table td{padding:11px 16px;border-bottom:1px solid var(--line);vertical-align:top}
.cc-table tr:last-child td{border-bottom:none}
.cc-table tbody tr:hover{background:rgba(0,0,0,.02)}
.cc-badge{display:inline-block;font-size:11px;border-radius:999px;padding:3px 10px;font-weight:600;white-space:nowrap}
.cc-badge.todo{background:#f3e6c0;color:#7a5a1f}.cc-badge.done{background:#d7f0df;color:#1f6b45}.cc-badge.wip{background:#dbe6fb;color:#2f4bb3}
.cc-dep{display:inline-block;font-size:11px;font-weight:700;color:#fff;background:#2f4bb3;border-radius:6px;padding:3px 9px;white-space:nowrap}
.cc-empty{padding:22px 16px;color:var(--muted);font-size:13px;font-style:italic;text-align:center}
.cc-rowlink{color:#2f4bb3;cursor:pointer;font-weight:600}
.cc-thread{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:16px}
.cc-msgs{min-height:54vh;max-height:66vh;overflow-y:auto;padding-right:4px}
.cc-msg{display:flex;gap:10px;margin-bottom:10px}
.cc-ava{width:30px;height:30px;border-radius:50%;flex:0 0 30px;display:grid;place-items:center;color:#fff;font-weight:800;font-size:12px;background:#17170f}
.cc-bub{background:rgba(0,0,0,.04);border:1px solid var(--line);border-radius:12px;padding:8px 12px;max-width:78%;font-size:14px}
.cc-bub b{font-size:12px;color:var(--muted)}
.cc-comp{display:flex;gap:8px;margin-top:12px}
.cc-comp input{flex:1;padding:10px 12px;border:1px solid var(--line);border-radius:10px}
.cc-comp button{background:#17170f;color:#fff;border:none;border-radius:10px;padding:10px 18px;cursor:pointer}
.cc-contour{margin-top:14px;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:16px;display:none}.cc-contour.on{display:block}
.cc-contour .role{color:#2f4bb3;font-weight:600;margin-bottom:10px}
.cc-grid5{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
.cc-box{background:rgba(0,0,0,.03);border:1px solid var(--line);border-radius:10px;padding:10px}
.cc-box b{display:block;font-size:11px;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.cc-box li{list-style:none;font-size:13px;padding:3px 0 3px 12px;position:relative}.cc-box li::before{content:"–";position:absolute;left:0}
@media(max-width:820px){.cc-grid5{grid-template-columns:1fr 1fr}.cc-hero{flex-direction:column}.cc-hmeta{align-items:flex-start}}
/* редактор задачи (модалка) */
.cc-modal{position:fixed;inset:0;background:rgba(0,0,0,.4);display:flex;align-items:center;justify-content:center;z-index:200}
.cc-modal-card{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:20px;width:min(460px,92vw);box-shadow:0 20px 60px rgba(0,0,0,.3)}
.cc-modal-card h3{margin:0 0 14px;font-size:16px}
.cc-field{margin-bottom:12px}
.cc-field label{display:block;font-size:12px;color:var(--muted);margin-bottom:5px}
.cc-field input,.cc-field select,.cc-field textarea{width:100%;padding:9px 12px;border:1px solid var(--line);border-radius:9px;font-family:inherit;font-size:14px;background:var(--panel);color:var(--text)}
.cc-field textarea{min-height:72px;resize:vertical}
.cc-modal-actions{display:flex;justify-content:space-between;gap:8px;margin-top:16px;align-items:center}
.cc-btn{background:#17170f;color:#fff;border:none;border-radius:9px;padding:9px 16px;cursor:pointer;font-weight:600;font-size:13px}
.cc-btn.ghost{background:none;color:var(--muted);border:1px solid var(--line)}
.cc-btn.danger{background:none;color:#b3402f;border:1px solid #e0b0a8}
/* ── Чат ── */
.chat-body { display: flex; gap: 16px; align-items: stretch; }
.chat-list { width: 200px; flex-shrink: 0; padding: 10px; display: flex; flex-direction: column; gap: 3px; align-self: flex-start; }
.chat-item { display: flex; align-items: center; gap: 9px; width: 100%; text-align: left; background: none;
  color: var(--text); box-shadow: none; border-radius: 10px; padding: 10px 12px; font-size: 13.5px; font-weight: 500; transition: .13s; }
.chat-item span { font-size: 16px; }
.chat-item:hover { background: rgba(60,50,35,.05); transform: none; box-shadow: none; }
.chat-item.active { background: var(--cyan); color: #fff; }
.chat-main { flex: 1; min-width: 0; }
#chat-model { font-size: 13px; padding: 8px 12px; }
.hc-brain { color: var(--cyan); font-weight: 600; }
.chat-log { height: calc(100vh - 320px); overflow-y: auto; display: flex; flex-direction: column;
  gap: 12px; margin-bottom: 16px; }
.msg { max-width: 76%; padding: 12px 16px; border-radius: 16px; font-size: 14px; line-height: 1.55;
  white-space: pre-wrap; animation: rise .2s ease; }
@keyframes rise { from { opacity: 0; transform: translateY(6px); } }
.msg.user { align-self: flex-end; background: rgba(255,255,255,.78); color: var(--text);
  border: 1px solid rgba(201,162,39,.45);
  box-shadow: 0 4px 14px rgba(60,50,35,.06), inset 0 1px 0 rgba(255,255,255,.8); }
.msg.assistant { align-self: flex-start; background: var(--panel); border: 1px solid var(--line); box-shadow: var(--shadow-sm); }
.msg.err { align-self: flex-start; background: rgba(192,138,99,.1); border: 1px solid rgba(192,138,99,.3); color: #97633f; }
.msg.typing { align-self: flex-start; color: var(--muted); font-style: normal; }
/* Визуализация работы мозга: чипы «модель · время» под ответом + пульс во время думания */
.msg-meta { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 9px; }
.msg-meta .chip { font-size: 11px; color: var(--muted); background: rgba(255,255,255,.55);
  border: 1px solid var(--line); border-radius: 999px; padding: 2px 9px; line-height: 1.6; cursor: default; }
.msg-meta .chip.live { color: #8a6d1f; border-color: rgba(201,162,39,.4); background: rgba(201,162,39,.12); }
.think-meta { font-size: 12px; color: var(--muted); opacity: .85; }
.think-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 2px;
  background: var(--cyan); animation: thinkpulse 1.1s ease-in-out infinite; }
@keyframes thinkpulse { 0%,100% { opacity: .35; transform: scale(.8); } 50% { opacity: 1; transform: scale(1.15); } }
/* Повтор сообщения: ↻ в углу пузыря, у ошибок виден всегда, у остальных — по наведению */
.msg { position: relative; }
.msg-retry { position: absolute; top: -8px; right: -8px; width: 22px; height: 22px; padding: 0;
  border: 1px solid var(--line); border-radius: 50%; background: var(--panel); color: var(--muted);
  font-size: 12px; line-height: 20px; cursor: pointer; opacity: 0; transition: opacity .15s; }
.msg:hover .msg-retry { opacity: 1; }
.msg.err .msg-retry { opacity: .8; }
/* Озвучить ответ (🔊, по клику — нейроголос; повторный клик — стоп) */
.msg-spk { position: absolute; bottom: -8px; right: -8px; width: 22px; height: 22px; padding: 0;
  border: 1px solid var(--line); border-radius: 50%; background: var(--panel); color: var(--muted);
  font-size: 11px; line-height: 20px; cursor: pointer; opacity: 0; transition: opacity .15s; }
.msg:hover .msg-spk { opacity: 1; }
.msg-spk.on { opacity: 1; color: var(--gold, #c9a227); border-color: var(--gold, #c9a227); }

/* Кнопки голоса */
#chat-tts, #chat-clear { flex: 0 0 auto; padding: 11px 14px; font-size: 16px; line-height: 1; }
/* Озвучка — в золотой линии: белое стекло, тонкий золотой контурный динамик */
#chat-tts { background: rgba(255,255,255,.78); border: 1px solid rgba(201,162,39,.5);
  padding: 10px 12px; line-height: 0;
  box-shadow: 0 4px 14px rgba(60,50,35,.06), inset 0 1px 0 rgba(255,255,255,.8); }
#chat-tts svg { width: 20px; height: 20px; fill: none; stroke: rgba(201,162,39,.55); stroke-width: 1.8;
  stroke-linecap: round; stroke-linejoin: round; transition: .16s ease; }
#chat-tts:hover { background: rgba(201,162,39,.08); filter: none; }
#chat-tts:hover svg { stroke: rgba(201,162,39,.95); }
#chat-tts.on { background: rgba(201,162,39,.1); }
#chat-tts.on svg { stroke: #c9a227; filter: drop-shadow(0 0 6px rgba(201,162,39,.45)); }

/* Созвон — трубка в тон озвучке, чуть зеленее */
#chat-call { flex: 0 0 auto; background: rgba(255,255,255,.78); border: 1px solid rgba(76,140,74,.45);
  padding: 10px 12px; line-height: 0;
  box-shadow: 0 4px 14px rgba(60,50,35,.06), inset 0 1px 0 rgba(255,255,255,.8); }
#chat-call svg { width: 20px; height: 20px; fill: none; stroke: rgba(76,140,74,.75); stroke-width: 1.8;
  stroke-linecap: round; stroke-linejoin: round; transition: .16s ease; }
#chat-call:hover { background: rgba(76,140,74,.08); filter: none; }
#chat-call:hover svg { stroke: rgba(56,120,54,1); }

/* Кнопка «Отправить» — белая с тонкой золотой окантовкой, в тон пузырям */
#chat-send { background: rgba(255,255,255,.78); color: #8a6d1f;
  border: 1px solid rgba(201,162,39,.5); font-weight: 600;
  box-shadow: 0 4px 14px rgba(60,50,35,.06), inset 0 1px 0 rgba(255,255,255,.8); }
#chat-send:hover { background: rgba(201,162,39,.1); color: #6f5717; filter: none;
  box-shadow: 0 0 12px rgba(201,162,39,.28); }

/* Вкладка «Мозг» */
#brain-health div { padding: 2px 0; font-size: 12.5px; }
.hdot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 7px; }
.hdot.ok { background: #86a980; box-shadow: 0 0 5px rgba(134,169,128,.6); }
.hdot.bad { background: #e0554a; box-shadow: 0 0 6px rgba(224,85,74,.6); animation: thinkpulse 1.1s infinite; }
.brain-digest { padding: 16px 20px; font-size: 13.5px; line-height: 1.6;
  border: 1px solid rgba(201,162,39,.45); background: rgba(255,252,240,.85); }
.brain-body { display: grid; grid-template-columns: 280px 1fr; gap: 16px; margin-bottom: 16px; }
.brain-side { padding: 14px; }
.brain-h { font-size: 12px; letter-spacing: 1px; text-transform: uppercase; color: var(--muted); margin: 16px 0 8px; }
.brain-side .chat-item b { font-weight: 600; color: var(--muted); }
#brain-agents div { padding: 3px 0; font-size: 12.5px; }
#brain-agents b { color: #8a6d1f; font-variant-numeric: tabular-nums; margin-right: 6px; }
.brain-main { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.brain-cards { padding: 14px; display: flex; flex-wrap: wrap; gap: 8px; }
.brain-card { background: rgba(255,255,255,.78); border: 1px solid rgba(201,162,39,.4); color: var(--text);
  border-radius: 11px; padding: 8px 13px; font-size: 13px; font-weight: 500; text-align: left; }
.brain-card:hover { background: rgba(201,162,39,.08); box-shadow: 0 0 10px rgba(201,162,39,.2); }
.brain-card.open { background: rgba(201,162,39,.16); border-color: rgba(201,162,39,.85); box-shadow: 0 0 10px rgba(201,162,39,.25); }
.brain-reader { padding: 22px 26px; line-height: 1.65; font-size: 14px; max-height: 52vh; overflow: auto; }

/* Рендер карточек: заголовки, таблицы, списки, бейджи статусов */
.md-h { margin: 18px 0 8px; line-height: 1.3; }
h2.md-h { font-size: 19px; border-bottom: 1px solid rgba(201,162,39,.35); padding-bottom: 6px; }
h3.md-h { font-size: 15.5px; color: #6f5717; }
h4.md-h, h5.md-h { font-size: 14px; color: var(--muted); }
.md-p { margin: 7px 0; }
.md-list { margin: 7px 0 7px 22px; }
.md-list li { margin: 4px 0; }
.md-hr { border: 0; border-top: 1px solid var(--line); margin: 16px 0; }
.md-q { border-left: 3px solid rgba(201,162,39,.5); padding: 4px 12px; margin: 8px 0; color: var(--muted); }
.md-table { border-collapse: collapse; margin: 10px 0; width: 100%; font-size: 13px; }
.md-table th { background: rgba(201,162,39,.08); color: #6f5717; font-weight: 600; text-align: left; }
.md-table th, .md-table td { border: 1px solid rgba(201,162,39,.28); padding: 7px 10px; vertical-align: top; }
.md-table tr:nth-child(even) td { background: rgba(255,252,240,.5); }
.md-badge { display: inline-block; border-radius: 999px; padding: 1px 9px; font-size: 11.5px; font-weight: 600; }
.md-badge.ok { background: rgba(134,169,128,.15); color: #4e6c48; }
.md-badge.warn { background: rgba(201,162,39,.14); color: #8a6d1f; }
.md-badge.old { background: rgba(60,50,35,.08); color: var(--muted); }
.brain-reader a, .brain-digest a { color: #8a6d1f; }
.brain-log-wrap { padding: 14px 18px; }
.brain-log { font-family: var(--mono); font-size: 11.5px; line-height: 1.7; max-height: 180px; overflow: auto; }

/* Микрофон внутри строки ввода: полупрозрачное золото, справа */
.cmd-wrap { position: relative; flex: 1; display: flex; }
.cmd-wrap input, .home-cmd .cmd-wrap input, .compose .cmd-wrap input { padding-right: 52px; }
.cmd-wrap input { width: 100%; }
.mic-in { position: absolute; right: 6px; top: 50%; transform: translateY(-50%);
  background: transparent; border: none; padding: 8px 10px; box-shadow: none; line-height: 0; }
.mic-in svg { width: 21px; height: 21px; fill: none; stroke: rgba(201,162,39,.55); stroke-width: 1.9;
  stroke-linecap: round; stroke-linejoin: round; transition: .16s ease; }
.mic-in:hover { background: transparent; transform: translateY(-50%); box-shadow: none; filter: none; }
.mic-in:hover svg { stroke: rgba(201,162,39,.95); filter: drop-shadow(0 0 6px rgba(201,162,39,.35)); }
.mic-in.on svg { stroke: #c9a227; filter: drop-shadow(0 0 7px rgba(201,162,39,.6)); animation: micgold 1.2s infinite; }
@keyframes micgold { 0%,100% { opacity: 1; } 50% { opacity: .45; } }

/* Глобальный виджет «Спросить Алекса» */
.ask-fab { position: fixed; right: 24px; bottom: 24px; z-index: 60; width: 54px; height: 54px; border-radius: 50%;
  font-size: 22px; padding: 0; box-shadow: 0 6px 20px rgba(60,50,35,.18); }
.ask-panel { position: fixed; right: 24px; bottom: 88px; z-index: 60; width: 360px; max-width: calc(100vw - 48px);
  background: rgba(255,255,255,.9); border: 1px solid var(--line); border-radius: 20px; backdrop-filter: blur(20px);
  box-shadow: 0 20px 50px rgba(60,50,35,.16); display: flex; flex-direction: column; overflow: hidden; }
.ask-panel[hidden] { display: none; }
/* Глобальный плавающий чат «Спросить Гриффита» убран везде (Алекс 28.08):
   перекрывал кнопки и был бесполезен на телефоне. Чат доступен через вкладку.
   Вернуть — удалить это правило. */
.ask-fab, .ask-panel { display: none !important; }
.ask-head { display: flex; align-items: center; justify-content: space-between; padding: 14px 16px; border-bottom: 1px solid var(--line); }
.ask-head b { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; }
.ask-actions { display: flex; gap: 5px; }
.ask-panel .cc-ic { background: rgba(60,50,35,.05); color: var(--muted); border: none; border-radius: 9px; width: 30px; height: 30px; cursor: pointer; font-size: 14px; padding: 0; }
.ask-panel .cc-ic:hover { color: var(--text); background: rgba(60,50,35,.09); }
.ask-panel .cc-ic.on { background: rgba(201,162,39,.18); color: #8a6d1f; }
.ask-log { padding: 16px; height: 300px; overflow-y: auto; display: flex; flex-direction: column; gap: 8px; }
.ask-log:empty::before { content: "Спроси или скажи голосом — я на любой вкладке."; color: var(--muted); font-size: 12px; }
.ask-log .msg { max-width: 92%; font-size: 13px; padding: 9px 12px; }
.ask-input { display: flex; gap: 8px; padding: 14px; border-top: 1px solid var(--line); }
.ask-input input { flex: 1; }
.ask-input .cc-ic.on { background: rgba(192,138,99,.18); color: #97633f; animation: micpulse 1.2s infinite; }

/* ── Карта концепции ── */
#tab-concept { padding: 0; }
.cmap-wrap {
  position: relative; height: calc(100vh - 150px);
  border: 1px solid var(--line); border-radius: 20px; overflow: hidden;
  background-color: #ece5d7;
  background-image:
    radial-gradient(1200px 820px at 50% -8%, rgba(255,255,255,.78), transparent 62%),
    radial-gradient(900px 700px at 88% 112%, rgba(201,162,39,.12), transparent 60%);
  box-shadow: inset 0 0 120px rgba(74, 60, 40, 0.15), var(--shadow-sm);
}
#cmap { width: 100%; height: 100%; display: block; cursor: grab; touch-action: none; user-select: none; }
#cmap:active { cursor: grabbing; }
.cmap-title { position: absolute; top: 16px; left: 20px;
  font-size: 11px; letter-spacing: 2px; color: var(--muted); pointer-events: none; font-weight: 600; }
.cmap-views { position: absolute; top: 14px; left: 50%; transform: translateX(-50%);
  display: flex; gap: 6px; z-index: 5; flex-wrap: wrap; justify-content: center; }
.cm-chip { background: rgba(255,255,255,.82); border: 1px solid var(--line); color: var(--muted);
  font-size: 12px; font-weight: 600; padding: 7px 13px; border-radius: 20px; box-shadow: var(--shadow-sm); }
.cm-chip:hover { color: var(--text); transform: none; }
.cm-chip.active { background: var(--cyan); color: #fff; border-color: var(--cyan); }
.cmap-toolbar { position: absolute; bottom: 16px; left: 50%; transform: translateX(-50%);
  display: flex; gap: 8px; align-items: center; background: rgba(255,255,255,.85);
  border: 1px solid var(--line); border-radius: 14px; padding: 7px 10px; backdrop-filter: blur(10px); box-shadow: var(--shadow-sm); }
.cbtn { background: rgba(60,50,35,.05); color: var(--text);
  font-weight: 500; font-size: 12px; padding: 7px 12px; }
.cbtn:hover { background: var(--cyan); color: #fff; transform: none; }
.cm-hint { font-size: 11px; color: var(--muted); margin-left: 6px; }
.cmap-legend { position: absolute; top: 16px; right: 20px; display: flex; flex-direction: column;
  gap: 6px; background: rgba(255,255,255,.8); border: 1px solid var(--line); border-radius: 14px;
  padding: 10px 12px; backdrop-filter: blur(10px); box-shadow: var(--shadow-sm); }
.cm-leg { display: flex; align-items: center; gap: 8px; font-size: 11px; color: var(--muted); }
.cm-leg i { width: 9px; height: 9px; border-radius: 50%; }

.edge-base { fill: none; stroke: var(--line); stroke-width: 1.5; opacity: .8; }
.edge-flow { fill: none; stroke-width: 2.3; opacity: 0; stroke-linecap: round; transition: opacity .5s ease; }
.edge-flow.flow { opacity: .8; stroke-dasharray: 2 15; animation: flowdash 1.1s linear infinite; }
@keyframes flowdash { to { stroke-dashoffset: -17; } }

.cnode { --c: #7d9a86; opacity: 0; transform: scale(.55); transform-box: fill-box;
  transform-origin: center; transition: opacity .5s ease, transform .55s cubic-bezier(.2,.9,.25,1);
  cursor: grab; }
.cnode.in { opacity: 1; transform: scale(1); }
.cnode.drag { cursor: grabbing; }
.cn-box { fill: #fff; stroke: var(--c); stroke-width: 1.6; transition: filter .2s, fill .2s;
  filter: drop-shadow(0 6px 15px rgba(60,50,35,.16)); }
.cnode:hover .cn-box { fill: #fffdf9; filter: drop-shadow(0 12px 24px rgba(60,50,35,.22)); }
.cn-title { fill: var(--text); font-size: 14px; font-weight: 600; font-family: var(--sans); }
.cn-sub { fill: var(--muted); font-size: 10.5px; font-family: var(--sans); letter-spacing: .2px; }

/* Бейдж комментариев на узле */
.cn-badge { cursor: pointer; }
.cn-badge circle { fill: var(--orange); stroke: #fff; stroke-width: 1.5; }
.cn-badge text { fill: #fff; font-size: 11px; font-weight: 700; font-family: var(--sans); text-anchor: middle; }

/* Плавающая кнопка обсуждения */
.cmap-fab { position: absolute; right: 20px; bottom: 68px; width: 52px; height: 52px;
  border-radius: 50%; font-size: 22px; padding: 0; display: flex; align-items: center;
  justify-content: center; box-shadow: 0 6px 18px rgba(60,50,35,.18); z-index: 5; }
.cmap-fab.hidden { display: none; }

/* Окно обсуждения */
.cmap-chat { position: absolute; right: 20px; bottom: 20px; width: 360px; max-width: calc(100% - 40px);
  height: 460px; max-height: calc(100% - 40px); display: flex; flex-direction: column; z-index: 6;
  background: rgba(255,255,255,.92); border: 1px solid var(--line); border-radius: 20px;
  backdrop-filter: blur(20px); box-shadow: 0 20px 50px rgba(60,50,35,.18); overflow: hidden;
  animation: ccrise .22s ease; }
@keyframes ccrise { from { opacity: 0; transform: translateY(14px); } }
.cmap-chat[hidden] { display: none; }
.cc-head { display: flex; align-items: center; justify-content: space-between; padding: 14px 16px;
  border-bottom: 1px solid var(--line); }
.cc-head b { font-size: 13px; display: flex; align-items: center; gap: 8px; font-weight: 600; }
.cc-actions { display: flex; gap: 4px; }
.cc-ic { background: rgba(60,50,35,.05); color: var(--muted); padding: 4px 8px;
  font-size: 14px; border-radius: 8px; }
.cc-ic:hover { background: rgba(60,50,35,.09); color: var(--text); transform: none; }
.cc-ic.on { background: rgba(134,169,128,.18); color: #8a6d1f; }
.cc-log { flex: 1; overflow-y: auto; padding: 16px; display: flex; flex-direction: column; gap: 10px; }
.cc-log::-webkit-scrollbar { width: 7px; }
.cc-log::-webkit-scrollbar-thumb { background: rgba(60,50,35,.14); border-radius: 6px; }
.cc-msg { max-width: 86%; padding: 9px 12px; border-radius: 13px; font-size: 13px; line-height: 1.5;
  white-space: pre-wrap; animation: rise .2s ease; }
.cc-msg.user { align-self: flex-end; background: var(--cyan); color: #fff; }
.cc-msg.assistant { align-self: flex-start; background: rgba(60,50,35,.04); border: 1px solid var(--line); }
.cc-msg .cc-node { display: block; font-size: 10px; opacity: .7; margin-bottom: 3px; }
.cc-empty { color: var(--muted); font-size: 12px; text-align: center; margin: auto; }
.cc-ctx { padding: 6px 14px; font-size: 11px; color: var(--orange);
  border-top: 1px solid var(--line); display: flex; align-items: center; gap: 8px; }
.cc-ctx[hidden] { display: none; }
.cc-ctx button { background: none; color: var(--muted); padding: 0 4px; font-size: 14px; }
.cc-input { display: flex; gap: 8px; padding: 14px; border-top: 1px solid var(--line); }
.cc-input input { flex: 1; padding: 9px 12px; font-size: 13px; }
.cc-input button { padding: 9px 15px; }
.cc-pending { align-self: flex-start; color: var(--muted); font-size: 12px; font-style: italic; }

/* ══ Проект: Агентство ══ */
#ag-wrap { display: flex; flex-direction: column; gap: 30px; }
.ag-sec > h1 { font-size: 13px; letter-spacing: 1.4px; text-transform: uppercase; color: var(--muted);
  font-weight: 600; margin-bottom: 16px; display: flex; align-items: center; gap: 10px; }
.ag-sec > h1 .dot { width: 8px; height: 8px; }

/* Шапка проекта */
.ag-hero { display: flex; justify-content: space-between; align-items: flex-start; gap: 24px;
  padding: 28px; border-radius: 22px; border: 1px solid var(--line); background: var(--panel); box-shadow: var(--shadow); }
.ag-hero h1 { font-size: 28px; letter-spacing: -0.02em; font-weight: 600; }
.ag-hero .ag-tag { color: var(--cyan); font-size: 13px; font-weight: 500; margin: 6px 0 12px; }
.ag-hero p { color: #575047; font-size: 14px; line-height: 1.6; max-width: 620px; }
.ag-hero .ag-niches { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.ag-stage { flex-shrink: 0; font-size: 11px; letter-spacing: .5px; font-weight: 600; color: #8a6d1f;
  border: 1px solid rgba(134,169,128,.35); background: rgba(134,169,128,.12); padding: 7px 13px; border-radius: 20px; }

/* Архитектура — карточки */
.ag-arch-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(215px, 1fr)); gap: 14px; }
.ag-card { position: relative; padding: 20px; border-radius: 16px; border: 1px solid var(--line);
  background: var(--panel); cursor: pointer; transition: .18s; overflow: hidden; box-shadow: var(--shadow-sm); }
.ag-card:before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--c, var(--cyan)); }
.ag-card:hover { transform: translateY(-3px); box-shadow: var(--shadow); }
.ag-card .ag-ic { font-size: 22px; color: var(--c, var(--cyan)); margin-bottom: 8px; }
.ag-card h3 { font-size: 15px; font-weight: 600; margin-bottom: 6px; }
.ag-card .ag-short { font-size: 12px; color: var(--muted); }
.ag-card .ag-more { position: absolute; right: 14px; bottom: 12px; font-size: 11px; color: var(--muted); opacity: 0; transition: .18s; }
.ag-card:hover .ag-more { opacity: 1; }

/* Финансы */
.ag-fin { display: flex; gap: 30px; align-items: center; flex-wrap: wrap;
  padding: 28px; border-radius: 22px; border: 1px solid var(--line); background: var(--panel); box-shadow: var(--shadow); }
.ag-rings { position: relative; width: 220px; height: 220px; flex-shrink: 0; }
.ag-rings svg { width: 100%; height: 100%; transform: rotate(-90deg); }
.ag-ring-track { fill: none; stroke: var(--line); }
.ag-ring-val { fill: none; stroke-linecap: round; transition: stroke-dashoffset 1.1s cubic-bezier(.3,.85,.3,1); }
.ag-rings-center { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center;
  justify-content: center; pointer-events: none; }
.ag-rings-center b { font-size: 30px; font-weight: 600; font-variant-numeric: tabular-nums; }
.ag-rings-center small { font-size: 10px; letter-spacing: 1.5px; color: var(--muted); margin-top: 3px; text-transform: uppercase; }
.ag-bars { flex: 1; min-width: 260px; display: flex; flex-direction: column; gap: 14px; }
.ag-bar-row .ag-bar-top { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 6px; }
.ag-bar-row .ag-bar-label { font-size: 13px; }
.ag-bar-row .ag-bar-num { font-size: 12px; color: var(--muted); font-variant-numeric: tabular-nums; }
.ag-bar-track { height: 10px; border-radius: 6px; background: rgba(60,50,35,.06); overflow: hidden; }
.ag-bar-fill { height: 100%; border-radius: 6px; width: 0; transition: width 1s cubic-bezier(.3,.85,.3,1); }
.ag-crit { margin-top: 4px; display: flex; flex-wrap: wrap; gap: 8px; }
.ag-crit .chip { border-left: 2px solid var(--cyan); border-radius: 6px; }

/* Задачи — Linear-стиль */
.ag-tasks { border: 1px solid var(--line); border-radius: 16px; overflow: hidden; background: var(--panel); box-shadow: var(--shadow-sm); }
.ag-tgroup-head { display: flex; align-items: center; gap: 10px; padding: 11px 16px; font-size: 12px;
  letter-spacing: .8px; text-transform: uppercase; color: var(--muted); font-weight: 600; background: rgba(60,50,35,.02);
  border-top: 1px solid var(--line); }
.ag-tgroup-head:first-child { border-top: none; }
.ag-tgroup-head .cnt { margin-left: auto; }
.ag-task { display: flex; align-items: center; gap: 12px; padding: 12px 16px; border-top: 1px solid var(--line);
  cursor: pointer; transition: .13s; }
.ag-task:hover { background: rgba(201,162,39,.05); }
.ag-task .st { width: 12px; height: 12px; border-radius: 50%; flex-shrink: 0; }
.ag-task .tid { font-size: 11px; color: var(--muted); width: 46px; flex-shrink: 0; font-variant-numeric: tabular-nums; }
.ag-task .ttl { font-size: 14px; flex: 1; }
.ag-task .prio { font-size: 10px; letter-spacing: .5px; text-transform: uppercase; font-weight: 600;
  padding: 3px 8px; border-radius: 6px; flex-shrink: 0; }
.ag-task .tnote { flex-basis: 100%; font-size: 12.5px; color: var(--muted); padding: 8px 0 2px 70px;
  line-height: 1.55; display: none; }
.ag-task.open .tnote { display: block; }
.prio.urgent { background: rgba(192,138,99,.16); color: #97633f; }
.prio.high { background: rgba(192,138,99,.12); color: #a5714b; }
.prio.medium { background: rgba(130,152,172,.14); color: #566a7d; }
.prio.low { background: rgba(60,50,35,.06); color: var(--muted); }
.st.done { color: var(--green); background: var(--green); }
.st.in_progress { color: var(--orange); background: var(--orange); }
.st.todo { color: var(--cyan); background: transparent; box-shadow: inset 0 0 0 2px var(--cyan); }
.st.backlog { color: var(--muted); background: transparent; box-shadow: inset 0 0 0 2px var(--muted); }

/* Задачи — доска-канбан */
.ag-board { display: flex; gap: 14px; align-items: flex-start; overflow-x: auto; padding-bottom: 8px; }
.ag-board::-webkit-scrollbar { height: 8px; }
.ag-board::-webkit-scrollbar-thumb { background: rgba(60,50,35,.14); border-radius: 6px; }
.ag-col { flex: 1 1 0; min-width: 215px; background: var(--panel); border: 1px solid var(--line);
  border-radius: 16px; overflow: hidden; box-shadow: var(--shadow-sm); }
.ag-col-head { display: flex; align-items: center; gap: 8px; padding: 12px 14px; font-size: 12px;
  letter-spacing: .8px; text-transform: uppercase; color: var(--muted); font-weight: 600; border-bottom: 1px solid var(--line);
  background: rgba(60,50,35,.02); }
.ag-col-head .cnt { margin-left: auto; }
.ag-col-body { padding: 10px; display: flex; flex-direction: column; gap: 10px; min-height: 44px; }
.ag-tcard { background: #fff; border: 1px solid var(--line); border-left: 3px solid var(--muted);
  border-radius: 11px; padding: 12px; cursor: pointer; transition: .14s; box-shadow: var(--shadow-sm); }
.ag-tcard:hover { transform: translateY(-2px); box-shadow: var(--shadow); }
.ag-tcard.p-urgent { border-left-color: var(--orange); }
.ag-tcard.p-high { border-left-color: #c9a06f; }
.ag-tcard.p-medium { border-left-color: var(--blue); }
.ag-tcard.p-low { border-left-color: var(--muted); }
.ag-tcard-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 7px; }
.ag-tcard .tid { font-size: 11px; color: var(--muted); font-variant-numeric: tabular-nums; }
.ag-tcard .ttl { font-size: 13.5px; line-height: 1.4; }
.ag-tcard .tnote { font-size: 12px; color: var(--muted); line-height: 1.5; margin-top: 8px; display: none; }
.ag-tcard.open .tnote { display: block; }
.ag-col-empty { color: var(--muted); font-size: 12px; text-align: center; padding: 8px 0; }
.ag-tcard { cursor: grab; }
.ag-tcard:active { cursor: grabbing; }
.ag-tcard.dragging { opacity: .45; }
.ag-col.drop-hover { border-color: var(--cyan); }
.ag-col.drop-hover .ag-col-body { background: rgba(201,162,39,.08); outline: 1px dashed rgba(201,162,39,.5); outline-offset: -6px; border-radius: 10px; }

/* ══ Досье проекта (Notion-стиль) ══ */
.doc-layout { display: flex; gap: 40px; align-items: flex-start; }
.doc-toc { position: sticky; top: 0; flex-shrink: 0; width: 222px; display: flex; flex-direction: column; gap: 2px;
  padding: 16px 12px; max-height: calc(100vh - 140px); overflow-y: auto;
  background: rgba(255, 255, 255, 0.55); border: 1px solid var(--line); border-radius: 16px; box-shadow: var(--shadow-sm); }
.doc-toc .toc-title { font-size: 10px; letter-spacing: 1.4px; text-transform: uppercase; color: var(--muted);
  font-weight: 600; margin-bottom: 8px; }
.doc-toc a { font-size: 13px; color: var(--muted); text-decoration: none; padding: 6px 10px; border-radius: 9px;
  border-left: 2px solid transparent; transition: .14s; cursor: pointer; line-height: 1.35; }
.doc-toc a.sub { padding-left: 22px; font-size: 12px; }
.doc-toc a:hover { color: var(--text); background: rgba(60,50,35,.04); }
.doc-toc a.active { color: var(--cyan); border-left-color: var(--cyan); background: rgba(201,162,39,.08); }

.doc { flex: 1; max-width: 820px; font-size: 15px; line-height: 1.75; color: #46413a; padding-bottom: 55vh; }
.doc .doc-title { font-size: 34px; font-weight: 700; color: var(--text); letter-spacing: -0.02em; margin-bottom: 4px; }
.doc .doc-upd { font-size: 11px; color: var(--muted); margin-bottom: 26px; }
.doc h1 { font-size: 24px; font-weight: 600; color: var(--text); letter-spacing: -0.01em; margin: 34px 0 12px;
  padding-bottom: 8px; border-bottom: 1px solid var(--line); scroll-margin-top: 20px; }
.doc h2 { font-size: 18px; font-weight: 600; color: var(--text); text-transform: none; letter-spacing: 0;
  margin: 24px 0 8px; scroll-margin-top: 20px; }
.doc h3 { font-size: 15px; font-weight: 600; color: var(--text); margin: 18px 0 6px; }
.doc p { margin: 10px 0; }
.doc ul, .doc ol { margin: 10px 0 10px 6px; padding-left: 22px; }
.doc li { margin: 5px 0; }
.doc ul li::marker { color: var(--cyan); }
.doc ol li::marker { color: var(--orange); }
.doc .doc-callout { display: flex; gap: 12px; align-items: flex-start; background: rgba(201,162,39,.08);
  border: 1px solid rgba(201,162,39,.2); border-radius: 14px; padding: 14px 16px; margin: 16px 0; font-size: 14px; }
.doc .doc-callout .ic { font-size: 18px; line-height: 1.4; flex-shrink: 0; }
.doc blockquote { border-left: 3px solid var(--orange); padding: 6px 0 6px 16px; margin: 16px 0; color: #575047;
  font-style: italic; }
.doc hr { border: none; border-top: 1px solid var(--line); margin: 28px 0; }
.doc details { border: 1px solid var(--line); border-radius: 14px; margin: 12px 0; background: var(--panel); overflow: hidden; }
.doc details summary { cursor: pointer; padding: 13px 16px; font-weight: 600; color: var(--text); font-size: 14.5px;
  list-style: none; display: flex; align-items: center; gap: 10px; user-select: none; }
.doc details summary::-webkit-details-marker { display: none; }
.doc details summary::before { content: "▸"; color: var(--cyan); transition: transform .18s; display: inline-block; }
.doc details[open] summary::before { transform: rotate(90deg); }
.doc details summary:hover { background: rgba(60,50,35,.03); }
.doc details .doc-toggle-body { padding: 2px 16px 14px 40px; }
.doc details .doc-toggle-body p { margin: 4px 0; }
.doc table { width: 100%; border-collapse: collapse; margin: 16px 0; font-size: 13.5px; }
.doc th, .doc td { border: 1px solid var(--line); padding: 9px 12px; text-align: left; vertical-align: top; }
.doc th { background: rgba(60,50,35,.03); color: var(--muted); font-weight: 600; font-size: 11px;
  text-transform: uppercase; letter-spacing: .8px; }
.doc tr:last-child td { font-weight: 600; }
.doc tr:hover td { background: rgba(201,162,39,.04); }

/* Досье — панель и режим правки */
.doc-bar { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
#doc-edit.on { background: rgba(134,169,128,.18); color: #8a6d1f; }
.doc-block { position: relative; }
.doc.editing .doc-block { border-radius: 8px; transition: background .12s; }
.doc.editing .doc-block:hover { background: rgba(60,50,35,.02); }
.doc .ce { outline: none; }
.doc.editing .ce { cursor: text; }
.doc.editing .ce:focus { outline: 1px solid rgba(201,162,39,.5); outline-offset: 3px; border-radius: 4px; }
.doc.editing .ce:empty::before { content: 'пусто'; color: var(--muted); opacity: .5; }
.db-tools { position: absolute; top: 4px; right: 4px; display: none; gap: 2px; z-index: 3;
  background: rgba(255,255,255,.95); border: 1px solid var(--line); border-radius: 8px; padding: 2px; box-shadow: var(--shadow-sm); }
.doc.editing .doc-block:hover .db-tools { display: flex; }
.db-tools button { background: none; color: var(--muted); padding: 3px 7px; font-size: 12px; border-radius: 5px; }
.db-tools button:hover { background: rgba(201,162,39,.16); color: #8a6d1f; transform: none; }
.db-add { display: none; margin: 3px 0; }
.doc.editing .db-add { display: block; }
.db-add button { width: 100%; text-align: left; background: none; color: var(--muted);
  font-size: 12px; padding: 4px 8px; border-radius: 6px; opacity: .4; font-weight: 500; transition: .12s; }
.db-add button:hover { opacity: 1; background: rgba(201,162,39,.1); color: #8a6d1f; transform: none; }
.doc-mini { background: rgba(60,50,35,.05); color: var(--muted); font-size: 11px;
  padding: 4px 10px; border-radius: 6px; margin-top: 6px; font-weight: 500; }
.doc-mini:hover { background: rgba(201,162,39,.16); color: #8a6d1f; transform: none; }
.li-del { background: none; color: var(--muted); padding: 0 6px; font-size: 12px; margin-left: 6px;
  opacity: 0; transition: .12s; }
.doc.editing li:hover .li-del { opacity: .6; }
.li-del:hover { opacity: 1 !important; color: var(--orange); transform: none; }
.doc-addmenu { position: fixed; z-index: 60; width: 200px; background: rgba(255,255,255,.98);
  border: 1px solid var(--line); border-radius: 12px; padding: 6px; display: flex; flex-direction: column; gap: 1px;
  box-shadow: 0 14px 40px rgba(60,50,35,.18); }
.doc-addmenu button { background: none; color: var(--text); text-align: left; padding: 8px 12px;
  font-size: 13px; border-radius: 7px; font-weight: 500; }
.doc-addmenu button:hover { background: rgba(201,162,39,.12); color: #8a6d1f; transform: none; }

/* Агенты */
.ag-agents { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 14px; }
.ag-agent { padding: 20px; border-radius: 16px; border: 1px solid var(--line); background: var(--panel);
  cursor: pointer; transition: .18s; box-shadow: var(--shadow-sm); }
.ag-agent:hover { transform: translateY(-3px); box-shadow: var(--shadow); }
.ag-agent h3 { font-size: 15px; font-weight: 600; margin-bottom: 5px; display: flex; align-items: center; gap: 8px; }
.ag-agent h3:before { content: "◉"; color: var(--orange); font-size: 12px; }
.ag-agent .ag-role { font-size: 12.5px; color: #575047; margin-bottom: 10px; }
.ag-agent .ag-stack { font-size: 11px; color: var(--muted); }

/* Модалка деталей */
.ag-modal { position: fixed; inset: 0; z-index: 50; display: flex; align-items: center; justify-content: center;
  background: rgba(60,50,35,.32); backdrop-filter: blur(8px); animation: rise .2s ease; }
.ag-modal[hidden] { display: none; }
.ag-modal-card { position: relative; width: min(560px, 92vw); max-height: 80vh; overflow-y: auto;
  background: #fff; border: 1px solid var(--line); border-radius: 22px; padding: 30px;
  box-shadow: 0 30px 70px rgba(60,50,35,.28); }
.ag-modal-card h2 { font-size: 22px; text-transform: none; letter-spacing: -0.01em; color: var(--text); margin-bottom: 6px;
  font-weight: 600; display: flex; align-items: center; gap: 10px; }
.ag-modal-card .ag-m-ic { font-size: 26px; color: var(--cyan); }
.ag-modal-card .ag-m-sub { font-size: 12px; color: var(--muted); margin-bottom: 16px; }
.ag-modal-card .ag-m-detail { font-size: 14.5px; line-height: 1.7; color: #575047; white-space: pre-wrap; }
.ag-modal-close { position: absolute; top: 16px; right: 16px; background: rgba(60,50,35,.06); color: var(--muted);
  width: 30px; height: 30px; padding: 0; font-size: 18px; border-radius: 9px; }
.ag-modal-close:hover { background: rgba(60,50,35,.12); color: var(--text); transform: none; }

/* ── Обзор: блоки и плитки папок ── */
.ov-block { margin-top: 28px; }
.folder-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; }
.folder-tile { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; background: var(--panel);
  border: 1px solid var(--line); border-radius: 16px; padding: 16px 18px; box-shadow: var(--shadow-sm);
  color: var(--text); font-size: 14px; font-weight: 500; text-align: left; cursor: pointer; transition: .16s; }
.folder-tile:hover { transform: translateY(-2px); box-shadow: var(--shadow); background: #fff; }
.folder-tile .ft-ic { font-size: 24px; }

/* ── Личное: браузер Obsidian ── */
.ob-folders { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 18px; }
.ob-fchip { display: inline-flex; align-items: center; gap: 7px; background: var(--panel); border: 1px solid var(--line);
  border-radius: 12px; padding: 9px 14px; font-size: 13.5px; font-weight: 500; color: var(--text); cursor: pointer;
  box-shadow: var(--shadow-sm); transition: .15s; }
.ob-fchip:hover { background: #fff; transform: translateY(-1px); }
.ob-fchip.active { background: var(--cyan); color: #fff; border-color: var(--cyan); }
.ob-body { display: flex; gap: 18px; align-items: stretch; height: calc(100vh - 240px); }
.ob-list { width: 260px; flex-shrink: 0; overflow-y: auto; padding: 10px; }
.ob-item { display: block; width: 100%; text-align: left; background: none; color: var(--text); box-shadow: none;
  border-radius: 10px; padding: 10px 12px; font-size: 13.5px; font-weight: 500; margin-bottom: 2px; transition: .13s; }
.ob-item:hover { background: rgba(60,50,35,.05); transform: none; box-shadow: none; }
.ob-item.active { background: rgba(201,162,39,.16); color: #4a6a52; }
.ob-item small { display: block; color: var(--muted); font-weight: 400; font-size: 11px; margin-top: 2px; }
.ob-reader { flex: 1; overflow-y: auto; padding: 30px 34px; }
.ob-doc { max-width: 720px; font-size: 15px; line-height: 1.75; color: #46413a; }
.ob-doc h3 { font-size: 22px; font-weight: 600; letter-spacing: -0.01em; margin: 4px 0 14px; }
.ob-doc h4 { font-size: 17px; font-weight: 600; margin: 22px 0 8px; }
.ob-doc h5 { font-size: 13px; font-weight: 600; color: var(--muted); text-transform: uppercase; letter-spacing: .6px; margin: 18px 0 6px; }
.ob-doc p { margin: 10px 0; }
.ob-doc .ob-ul { list-style: none; margin: 8px 0; padding-left: 2px; }
.ob-doc .ob-ul li { margin: 5px 0; padding-left: 18px; position: relative; }
.ob-doc .ob-ul li:not(.ob-cbrow):before { content: "•"; position: absolute; left: 2px; color: var(--cyan); }
.ob-doc blockquote { border-left: 3px solid var(--orange); padding: 4px 0 4px 14px; margin: 14px 0; color: #575047; font-style: italic; }
.ob-doc hr { border: none; border-top: 1px solid var(--line); margin: 22px 0; }
.ob-doc .wl { color: var(--cyan); }
.ob-cbrow { padding-left: 0 !important; }
.ob-cbrow:before { display: none !important; }
.ob-check { display: flex; align-items: flex-start; gap: 10px; cursor: pointer; padding: 3px 0; user-select: none; }
.ob-box { flex-shrink: 0; width: 20px; height: 20px; border: 1.5px solid var(--muted); border-radius: 6px;
  display: flex; align-items: center; justify-content: center; font-size: 13px; color: #fff; transition: .14s; margin-top: 1px; }
.ob-check:hover .ob-box { border-color: var(--cyan); }
.ob-check.done .ob-box { background: var(--green); border-color: var(--green); }
.ob-check.done .ob-ctext { color: var(--muted); text-decoration: line-through; }

/* Таблицы в заметках */
.ob-doc .ob-table { width: 100%; border-collapse: collapse; margin: 14px 0; font-size: 13.5px; }
.ob-doc .ob-table th, .ob-doc .ob-table td { border: 1px solid var(--line); padding: 9px 12px; text-align: left; vertical-align: top; }
.ob-doc .ob-table th { background: rgba(60,50,35,.04); color: var(--muted); font-weight: 600; font-size: 11px;
  text-transform: uppercase; letter-spacing: .8px; }
.ob-doc .ob-table tr:hover td { background: rgba(201,162,39,.05); }
/* Заглушка dataview-дашборда */
.ob-dv { display: flex; gap: 12px; align-items: flex-start; background: rgba(130,152,172,.1);
  border: 1px solid rgba(130,152,172,.25); border-radius: 14px; padding: 14px 16px; margin: 14px 0; font-size: 13.5px; line-height: 1.55; }
.ob-dv span { font-size: 20px; line-height: 1.2; }
/* Код-блок */
.ob-code { background: rgba(45,40,32,.05); border: 1px solid var(--line); border-radius: 12px; padding: 14px 16px;
  font-family: var(--mono); font-size: 12px; line-height: 1.6; overflow-x: auto; margin: 12px 0; white-space: pre; }
/* Теги-чипы (#еда, #habit...) */
.ob-tag { display: inline-block; background: rgba(201,162,39,.14); color: #4a6a52; border-radius: 12px;
  padding: 1px 8px; font-size: 11.5px; font-weight: 600; }

/* ── Финансовый дашборд ── */
.fin-dash { font-weight: 600; }
.fin-add { display: flex; gap: 10px; align-items: center; margin-bottom: 20px; flex-wrap: wrap; }
.fin-type { display: flex; gap: 3px; background: rgba(60,50,35,.07); border-radius: 12px; padding: 3px; flex-shrink: 0; }
.fin-type button { background: transparent; color: var(--muted); box-shadow: none; padding: 9px 14px; font-size: 13px; border-radius: 9px; }
.fin-type button:hover { transform: none; color: var(--text); }
.fin-type button.on { background: #fff; color: var(--text); box-shadow: var(--shadow-sm); }
#ft-inc.on { color: #4a6a52; }
#fin-add-btn.inc { background: var(--green); }

/* ── Фитнес-хаб ── */
.fit-tab { font-weight: 600; }
.fit-row { display: flex; gap: 14px; align-items: flex-end; flex-wrap: wrap; margin-bottom: 8px; }
.fit-row label { display: flex; flex-direction: column; gap: 5px; font-size: 12px; color: var(--muted); font-weight: 600; }
.fit-row label.grow { flex: 1; min-width: 180px; }
#ft-km, #ft-time, #ft-turnik, #ft-brusya, #ft-press { width: 110px; }
#fd-kcal, #fd-prot { width: 110px; }
.fit-note { width: 100%; }
.fit-badge { font-size: 12px; font-weight: 600; color: #4a6a52; background: rgba(134,169,128,.15); padding: 4px 11px; border-radius: 20px; }
.fit-insight { font-size: 13.5px; padding: 9px 13px; border-radius: 11px; margin-bottom: 6px;
  background: rgba(255,255,255,.55); border: 1px solid var(--line); }
.fit-insight.warn { background: rgba(224,85,74,.1); border-color: rgba(224,85,74,.3); }
.fit-insight.good { background: rgba(134,169,128,.14); border-color: rgba(134,169,128,.3); }
.fit-macro { display: flex; flex-direction: column; gap: 14px; margin-bottom: 10px; }
.fit-macro-top { display: flex; justify-content: space-between; font-size: 13.5px; margin-bottom: 5px; }
.fit-macro-top b { font-variant-numeric: tabular-nums; }
.fit-photo-res { background: rgba(255,255,255,.65); border: 1px solid var(--line); border-radius: 14px;
  padding: 14px 16px; margin: 12px 0; font-size: 14px; line-height: 1.6; white-space: pre-wrap; }
.body-gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 14px; margin-top: 18px; }
.body-ph { margin: 0; }
.body-ph img { width: 100%; border-radius: 12px; box-shadow: var(--shadow-sm); display: block; }
.body-ph figcaption { font-size: 12px; color: var(--muted); text-align: center; margin-top: 6px; }
input[type=file] { padding: 9px; font-size: 12px; max-width: 240px; }
.fin-add #fin-amount { width: 120px; font-variant-numeric: tabular-nums; }
.fin-add #fin-text { flex: 1; min-width: 160px; }
.fin-add select { min-width: 150px; }
.fin-add button { flex-shrink: 0; }
.fin-cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 24px; }
.fin-card { background: rgba(255,255,255,.55); border: 1px solid rgba(255,255,255,.7); border-radius: 14px;
  padding: 14px 16px; box-shadow: var(--shadow-sm); }
.fin-card small { display: block; font-size: 10.5px; letter-spacing: 1px; text-transform: uppercase; color: var(--muted); margin-bottom: 5px; }
.fin-card b { font-size: 19px; font-weight: 700; font-variant-numeric: tabular-nums; letter-spacing: -0.01em; white-space: nowrap; }
.fin-card.neg b { color: #b3564a; }
.fin-h { font-size: 12px; letter-spacing: 1.2px; text-transform: uppercase; color: var(--muted); font-weight: 600; margin: 24px 0 12px; }
.fin-cat { margin-bottom: 13px; }
.fin-cat-top { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 5px; font-size: 13.5px; }
.fin-cat-num { font-weight: 600; font-variant-numeric: tabular-nums; }
.fin-cat-num em { font-style: normal; font-weight: 400; color: var(--muted); font-size: 12px; }
.fin-track { height: 9px; border-radius: 6px; background: rgba(60,50,35,.08); overflow: hidden; }
.fin-fill { height: 100%; border-radius: 6px; transition: width .8s cubic-bezier(.3,.85,.3,1); }
.fin-flags { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 18px; }
.fin-flag { font-size: 13px; font-weight: 600; padding: 7px 14px; border-radius: 20px;
  background: rgba(60,50,35,.05); border: 1px solid var(--line); }
.fin-flag.good { background: rgba(134,169,128,.15); color: #4a6a52; border-color: rgba(134,169,128,.3); }
.fin-flag.bad { background: rgba(224,85,74,.12); color: #b3564a; border-color: rgba(224,85,74,.3); }
.fin-txns { display: flex; flex-direction: column; }
.fin-txn { display: flex; align-items: baseline; gap: 12px; padding: 8px 2px; border-bottom: 1px solid var(--line); font-size: 13.5px; }
.fin-txn-date { color: var(--muted); font-size: 12px; font-variant-numeric: tabular-nums; flex-shrink: 0; width: 42px; }
.fin-txn-text { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fin-txn b { font-variant-numeric: tabular-nums; white-space: nowrap; }
.fin-txn b.plus { color: #4a6a52; }

/* Личное: панель заметки, правка, создание */
.ob-bar { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; }
.ob-crumb { font-size: 15px; font-weight: 600; color: var(--text); }
.ob-edit { background: rgba(60,50,35,.05); color: var(--muted); font-size: 12.5px; font-weight: 500; padding: 7px 13px; box-shadow: none; }
.ob-edit:hover { background: var(--cyan); color: #fff; }
.ob-edit-area { width: 100%; min-height: calc(100vh - 340px); resize: vertical; line-height: 1.7; font-size: 14px; font-family: var(--mono); }
.ob-new { display: block; width: 100%; margin-bottom: 8px; background: rgba(201,162,39,.14); color: #4a6a52; font-size: 13px; font-weight: 600; box-shadow: none; }
.ob-new:hover { background: var(--cyan); color: #fff; }

/* Календарь распорядка */
.ob-cal { padding: 6px 4px; }
.cal-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; padding: 0 4px; }
.cal-head span { font-size: 14px; font-weight: 600; }
.cal-nav { background: rgba(60,50,35,.05); color: var(--text); width: 30px; height: 30px; padding: 0; font-size: 18px; line-height: 1; box-shadow: none; border-radius: 9px; }
.cal-nav:hover { background: var(--cyan); color: #fff; }
.cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
.cal-wds { margin-bottom: 4px; }
.cal-wd { text-align: center; font-size: 10px; color: var(--muted); font-weight: 600; padding: 2px 0; }
.cal-day { aspect-ratio: 1 / 1; display: flex; align-items: center; justify-content: center; border-radius: 9px;
  font-size: 13px; color: var(--muted); cursor: pointer; transition: .12s; border: 1px solid transparent; }
.cal-day.empty { cursor: default; }
.cal-day.has { background: rgba(201,162,39,.14); color: var(--text); font-weight: 500; }
.cal-day.has:hover { background: rgba(201,162,39,.28); }
.cal-day:not(.empty):not(.has):hover { background: rgba(60,50,35,.05); color: var(--text); }
.cal-day.today { border-color: var(--orange); color: #97633f; font-weight: 700; }
.cal-day.sel { background: var(--cyan); color: #fff; font-weight: 700; }

/* Кнопка графика + график выполнения */
/* Металлическая кнопка (шампань-латунь) с бликом-переливом */
.ob-statbtn {
  position: relative; overflow: hidden; display: block; width: 100%; margin-top: 14px;
  padding: 12px 16px; border-radius: 12px; font-size: 13px; font-weight: 700; letter-spacing: .3px;
  color: #4a3d22; border: 1px solid rgba(255,255,255,.55);
  background: linear-gradient(150deg, #ead9b0 0%, #cdb47f 30%, #b6975c 52%, #dcc891 74%, #c1a469 100%);
  background-size: 220% 220%; background-position: 0% 50%;
  box-shadow: 0 2px 7px rgba(60,50,35,.2), inset 0 1px 0 rgba(255,255,255,.6), inset 0 -2px 4px rgba(90,70,40,.28);
  transition: background-position .6s ease, box-shadow .25s, transform .12s; cursor: pointer;
}
.ob-statbtn:hover {
  background-position: 100% 50%; transform: translateY(-1px); filter: none;
  box-shadow: 0 5px 16px rgba(150,110,50,.4), inset 0 1px 0 rgba(255,255,255,.75), inset 0 -2px 4px rgba(90,70,40,.32);
}
.ob-statbtn:active { transform: translateY(0); }
.ob-statbtn::before {
  content: ""; position: absolute; top: 0; left: -60%; width: 45%; height: 100%;
  background: linear-gradient(100deg, transparent, rgba(255,255,255,.8), transparent);
  transform: skewX(-18deg); pointer-events: none;
}
.ob-statbtn:hover::before { animation: sheen 1.15s ease-in-out infinite; }
@keyframes sheen { 0% { left: -60%; } 60%, 100% { left: 135%; } }

/* Контекстное меню заметки */
.note-menu { position: fixed; z-index: 200; background: rgba(255,255,255,.98); border: 1px solid var(--line);
  border-radius: 12px; padding: 6px; box-shadow: 0 14px 40px rgba(60,50,35,.2); min-width: 190px; animation: rise .12s ease; }
.note-menu button { width: 100%; text-align: left; background: none; color: var(--text); box-shadow: none;
  font-size: 13px; font-weight: 500; padding: 9px 12px; border-radius: 8px; }
.note-menu button:hover { background: rgba(192,138,99,.14); color: #97633f; transform: none; }

/* ══ ГЛАВНАЯ (Обзор) ══ */
/* Раскладка: часы сверху-справа · приветствие+строка по центру · карточки внизу */
#tab-overview { display: flex; flex-direction: column; min-height: calc(100vh - 140px); }
#tab-overview.hidden { display: none; }
.ov-top { display: flex; justify-content: flex-end; }
.ov-mid { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 10px 0 24px; }
.ov-bottom { display: flex; gap: 18px; align-items: stretch; }
.ov-bottom > * { flex: 1; }

/* Классические часы «а-ля Porsche» — крупные, над приветствием */
.pclock-wrap { text-align: center; margin-bottom: 22px; }
.pclock { width: 152px; height: 152px; display: block; filter: drop-shadow(0 6px 16px rgba(60,50,35,.14)); }
.pc-face { fill: rgba(255,255,255,.55); stroke: var(--line); stroke-width: 1.5; }
.pc-tick { stroke: var(--muted); stroke-width: 1; opacity: .5; }
.pc-tick.major { stroke: var(--text); stroke-width: 1.7; opacity: .85; }
.pc-hand { stroke-linecap: round; }
.pc-h { stroke: var(--text); stroke-width: 3.4; }
.pc-m { stroke: var(--text); stroke-width: 2.3; }
.pc-s { stroke: #c0563f; stroke-width: 1.2; }
.pc-cap { fill: var(--text); }
.pc-date { display: block; font-size: 11px; color: var(--muted); margin-top: 10px; text-transform: capitalize; }

/* Приветствие (прописью, живой набор) вплотную над стеклянной строкой */
.hh-greet { font-family: "Segoe Script", "Lucida Handwriting", "Brush Script MT", cursive;
  font-size: 36px; font-weight: 400; color: #4a4136; margin-bottom: 18px; line-height: 1.1; text-align: center; min-height: 46px; }
.hh-greet.writing { animation: penwrite 2.8s cubic-bezier(.35,.05,.35,1) forwards; }
@keyframes penwrite { from { clip-path: inset(0 100% -10% 0); } to { clip-path: inset(0 0 -10% 0); } }
.home-cmd { display: flex; gap: 12px; align-items: center; width: 100%; max-width: 1000px; }
.home-cmd input { flex: 1; padding: 16px 20px; font-size: 16px; border-radius: 15px;
  background: rgba(255,255,255,.45); backdrop-filter: blur(18px) saturate(1.3);
  border: 1px solid rgba(255,255,255,.75);
  box-shadow: 0 8px 26px rgba(60,50,35,.09), inset 0 1px 0 rgba(255,255,255,.7); }
.home-cmd input:focus { border-color: rgba(201,162,39,.6); box-shadow: 0 8px 26px rgba(60,50,35,.1), 0 0 0 3px rgba(201,162,39,.16); }
.cmd-arrow { width: 54px; height: 54px; padding: 0; font-size: 22px; line-height: 1; border-radius: 15px; flex-shrink: 0;
  color: var(--cyan); background: rgba(255,255,255,.5); backdrop-filter: blur(18px);
  border: 1px solid rgba(255,255,255,.75); box-shadow: 0 8px 26px rgba(60,50,35,.09); }
.cmd-arrow:hover { background: var(--cyan); color: #fff; }
.home-cmd-reply { width: 100%; max-width: 1000px; background: var(--panel); border: 1px solid var(--line); border-radius: 14px;
  padding: 15px 18px; font-size: 14px; line-height: 1.6; color: var(--text); margin-top: 14px; box-shadow: var(--shadow-sm); white-space: pre-wrap; }
.home-cmd-reply[hidden] { display: none; }
.home-cmd-reply.thinking { color: var(--muted); font-style: italic; }

/* Сетка карточек */
.home-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-bottom: 22px; }

/* Стеклянные карточки с лёгким переливом */
.ov-bottom .glass { background: rgba(255,255,255,.5); backdrop-filter: blur(18px) saturate(1.2);
  border: 1px solid rgba(255,255,255,.65); box-shadow: 0 12px 36px rgba(60,50,35,.1), inset 0 1px 0 rgba(255,255,255,.6); }
.iri { position: relative; overflow: hidden; }
.iri > * { position: relative; z-index: 1; }
.iri::after { content: ''; position: absolute; top: 0; left: -60%; width: 55%; height: 100%; z-index: 0;
  background: linear-gradient(105deg, transparent, rgba(255,255,255,.45) 45%, rgba(190,205,225,.25) 55%, transparent);
  transform: skewX(-14deg); animation: irisweep 7s ease-in-out infinite; pointer-events: none; }
@keyframes irisweep { 0% { left: -60%; } 45% { left: 115%; } 100% { left: 115%; } }

/* Контекст-навигация внутри проекта (← Проекты · разделы) */
.proj-ctx { display: flex; align-items: center; gap: 16px; padding: 11px 30px; border-bottom: 1px solid var(--line);
  background: rgba(255,255,255,.55); backdrop-filter: blur(10px); }
.proj-ctx[hidden] { display: none; }
.pc-back { background: rgba(60,50,35,.05); color: var(--muted); box-shadow: none; font-size: 13px; font-weight: 500; padding: 8px 14px; }
.pc-back:hover { background: var(--cyan); color: #fff; transform: none; }
.pc-title { font-size: 15px; font-weight: 700; }
.pc-views { display: flex; gap: 6px; margin-left: auto; }
.pc-view { background: rgba(60,50,35,.05); color: var(--text); box-shadow: none; font-size: 13px; font-weight: 500; padding: 8px 14px; }
.pc-view:hover { background: rgba(60,50,35,.1); transform: none; }
.pc-view.active { background: var(--cyan); color: #fff; }

/* ══ ЕДИНЫЙ МАТЕРИАЛ: матовое стекло на всех панелях (как на главной) ══ */
.glass, .pj, .ag-hero, .ag-card, .ag-fin, .ag-tasks, .ag-col, .ag-agent, .doc-toc, .doc, .ag-modal-card {
  background: rgba(255,255,255,.5);
  border: 1px solid rgba(255,255,255,.68);
  backdrop-filter: blur(18px) saturate(1.2);
  box-shadow: 0 12px 36px rgba(60,50,35,.09), inset 0 1px 0 rgba(255,255,255,.6);
}
/* Досье/Лендинги/Стратегия: текст теперь на стеклянной карточке */
.doc { border-radius: 20px; padding: 34px 40px 70px; }
/* Читаемость: карточки канбана и модалка чуть плотнее, без блюра на мелочах */
.ag-tcard { background: rgba(255,255,255,.72); backdrop-filter: none; }
.ag-modal-card { background: rgba(255,255,255,.9); }
/* Пузыри чата и чипы разделов — в тот же материал */
.msg.assistant { background: rgba(255,255,255,.6); }
.ob-fchip { background: rgba(255,255,255,.55); border-color: rgba(255,255,255,.68); }
/* Поля ввода — лёгкая полупрозрачность вместо плоского белого */
input, select, textarea { background: rgba(255,255,255,.6); }

/* Pulse — иконка-сердцебиение, пульсирует красным */
.pulse-ic { width: 19px; height: 19px; fill: none; stroke: #e0554a; stroke-width: 2.2; stroke-linecap: round;
  stroke-linejoin: round; transform-origin: center; animation: pulsebeat 1.1s ease-in-out infinite; }
@keyframes pulsebeat { 0%,100% { transform: scale(1); opacity: 1; } 50% { transform: scale(1.18); opacity: .5; } }
.pulse-body { display: flex; align-items: flex-start; justify-content: space-evenly; gap: 18px; }
.pulse-unit { text-align: center; }
.pu-label { font-size: 11px; letter-spacing: 1px; text-transform: uppercase; color: var(--muted); font-weight: 600; margin-top: 10px; }
.pu-count { font-size: 15px; font-weight: 600; margin-top: 2px; }
.pulse-ring { position: relative; width: 106px; height: 106px; flex-shrink: 0; margin: 0 auto; }
.pulse-ring svg { width: 100%; height: 100%; transform: rotate(-90deg); }
.pr-track { fill: none; stroke: var(--line); stroke-width: 9; }
.pr-val { fill: none; stroke: var(--green); stroke-width: 9; stroke-linecap: round; transition: stroke-dashoffset 1s cubic-bezier(.3,.85,.3,1); }
.pulse-ring b { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  font-size: 26px; font-weight: 700; letter-spacing: -0.02em; }
.pulse-info .pulse-count { font-size: 22px; font-weight: 600; }

/* Сводка проектов */
.proj-legend { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 18px; margin-bottom: 18px; }
.pl-item { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--muted); }
.pl-item b { font-size: 20px; font-weight: 700; color: var(--text); font-variant-numeric: tabular-nums; min-width: 22px; }
.pl-dot { width: 9px; height: 9px; border-radius: 50%; flex-shrink: 0; }
.pl-dot.green { background: var(--green); } .pl-dot.blue { background: var(--blue); }
.pl-dot.orange { background: var(--orange); } .pl-dot.muted { background: var(--muted); }
.proj-bar { height: 8px; border-radius: 6px; background: rgba(60,50,35,.08); overflow: hidden; margin-bottom: 10px; }
.proj-bar-fill { height: 100%; background: var(--green); border-radius: 6px; width: 0; transition: width 1s cubic-bezier(.3,.85,.3,1); }
.proj-sum { font-size: 13px; }

/* Статус-строка */
.home-status { display: flex; gap: 22px; flex-wrap: wrap; font-size: 12.5px; color: var(--muted); padding: 2px 4px; }
.home-status span { display: inline-flex; align-items: center; gap: 7px; }
.home-status i.ok { width: 7px; height: 7px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 3px rgba(134,169,128,.2); }
.stat-summary { display: flex; align-items: baseline; gap: 14px; margin: 6px 0 22px; }
.stat-big { font-size: 44px; font-weight: 700; letter-spacing: -0.02em; color: var(--green); font-variant-numeric: tabular-nums; }
.stat-sub { color: var(--muted); font-size: 13px; }
.stat-chart { display: flex; align-items: flex-end; gap: 5px; padding: 10px 4px; overflow-x: auto; }
.stat-col { flex: 0 0 auto; display: flex; flex-direction: column; align-items: center; gap: 6px; width: 20px; }
.stat-barwrap { height: 190px; display: flex; align-items: flex-end; width: 100%; }
.stat-bar { width: 100%; border-radius: 6px 6px 0 0; transition: height .5s cubic-bezier(.3,.85,.3,1); }
.stat-bar.hi { background: var(--green); }
.stat-bar.mid { background: #cbb26a; }
.stat-bar.lo { background: var(--orange); }
.stat-lbl { font-size: 10px; color: var(--muted); }

/* Библиотека — обложки книг */
.lib-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 22px; padding: 4px; }
.lib-book { cursor: pointer; }
.lib-cover { aspect-ratio: 2 / 3; border-radius: 10px; display: flex; align-items: center; justify-content: center;
  padding: 16px; text-align: center; box-shadow: 0 8px 20px rgba(60,50,35,.16); transition: .18s;
  border: 1px solid rgba(255,255,255,.4); }
.lib-book:hover .lib-cover { transform: translateY(-4px); box-shadow: 0 14px 30px rgba(60,50,35,.24); }
.lib-cover span { color: #fff; font-size: 15px; font-weight: 700; line-height: 1.3; letter-spacing: -0.01em;
  text-shadow: 0 1px 4px rgba(0,0,0,.2); }
.lib-title { font-size: 14px; font-weight: 600; margin: 10px 0 4px; }
.lib-desc { font-size: 12px; color: var(--muted); line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 3;
  -webkit-box-orient: vertical; overflow: hidden; }
.lib-ch { font-size: 11px; color: var(--cyan); margin-top: 6px; font-weight: 500; }

/* ── Живой индикатор записи голоса: стеклянная пилюля + золотой эквалайзер ── */
.voice-live{
  align-self:flex-start;display:flex;align-items:center;gap:10px;
  background:var(--glass);backdrop-filter:blur(10px);border:1px solid var(--line);
  border-radius:999px;padding:9px 16px;box-shadow:var(--shadow-sm);
  color:var(--muted);font-size:13.5px;
}
.vl-dot{width:8px;height:8px;border-radius:50%;background:var(--cyan);flex:none;animation:vl-pulse 1.6s ease-in-out infinite}
@keyframes vl-pulse{0%,100%{opacity:.35;transform:scale(.85)}50%{opacity:1;transform:scale(1.15)}}
.vl-eq{display:inline-flex;align-items:center;gap:3px;height:18px}
.vl-eq i{display:block;width:3px;height:4px;border-radius:2px;background:var(--cyan);opacity:.85;transition:height .12s ease}
.voice-live.warn{color:#a3573c;border-color:#d9b2a0}
.voice-live.warn .vl-dot,.voice-live.warn .vl-eq i{background:var(--orange)}

/* ── Контекстное меню (правый клик): стекло, как всё в пульте ── */
.ctx-menu{
  position:fixed;z-index:300;min-width:200px;padding:6px;
  background:var(--glass);backdrop-filter:blur(16px);
  border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);
  display:flex;flex-direction:column;
}
.ctx-menu button{
  display:flex;align-items:center;gap:11px;padding:9px 12px;border:0;background:none;
  font:inherit;font-size:14px;color:var(--text);border-radius:9px;cursor:pointer;text-align:left;
}
.ctx-menu button:hover{background:rgba(179,144,58,.12)}
.ctx-menu button.danger{color:#a3573c}
.ctx-menu button.danger:hover{background:rgba(192,138,99,.16)}
.ctx-menu .ci{width:18px;text-align:center;opacity:.8}

/* Плашка закрепа сверху ленты */
.pin-bar{
  position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:9px;
  background:var(--glass);backdrop-filter:blur(10px);border:1px solid var(--line);
  border-radius:12px;padding:8px 12px;font-size:13px;color:var(--muted);cursor:pointer;margin-bottom:8px;
}
.pin-bar .pin-text{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--text)}
.pin-bar button{border:0;background:none;cursor:pointer;color:var(--muted);font-size:13px;padding:2px 4px}
.pin-bar button:hover{color:#a3573c}

/* Подсветка сообщения при переходе из закрепа */
.msg.flash{animation:msg-flash 1.2s ease}
@keyframes msg-flash{0%{box-shadow:0 0 0 3px rgba(179,144,58,.45)}100%{box-shadow:none}}

/* Режим выделения сообщений */
#chat-log.selmode .msg[data-i]{cursor:pointer}
.msg.selected{outline:2px solid var(--cyan);outline-offset:2px}
#sel-bar{
  position:fixed;left:50%;transform:translateX(-50%);bottom:104px;z-index:250;
  display:flex;align-items:center;gap:14px;padding:10px 18px;
  background:var(--glass);backdrop-filter:blur(16px);border:1px solid var(--line);
  border-radius:999px;box-shadow:var(--shadow);font-size:14px;color:var(--text);
}
#sel-bar button{border:0;background:none;font:inherit;font-size:14px;color:var(--text);cursor:pointer;border-radius:8px;padding:4px 8px}
#sel-bar button:hover{background:rgba(179,144,58,.12)}
#sel-bar button.danger{color:#a3573c}

/* ── Контекстное меню v2: плотное и строгое, как в телеграме ── */
.ctx-menu{
  min-width:196px;padding:5px;background:var(--panel);backdrop-filter:none;
  border:1px solid var(--line);border-radius:12px;
  box-shadow:0 2px 6px rgba(60,50,35,.08),0 14px 40px rgba(60,50,35,.14);
  transform-origin:top left;animation:ctx-in .12s ease;
}
@keyframes ctx-in{from{opacity:0;transform:scale(.94)}to{opacity:1;transform:scale(1)}}
.ctx-menu button{gap:12px;padding:8px 14px 8px 10px;font-size:13.5px;border-radius:8px}
.ctx-menu button:hover{background:var(--bg0)}
.ctx-menu .ci{display:flex;align-items:center;justify-content:center;width:20px;height:20px;color:var(--muted)}
.ctx-menu .ci svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.ctx-menu button.danger{color:#b5543a}
.ctx-menu button.danger .ci{color:#b5543a}
.ctx-menu button.danger:hover{background:rgba(181,84,58,.08)}

/* иконки в пилюле выделения — та же гарнитура штриха */
#sel-bar .ci{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;color:currentColor;margin-right:6px;vertical-align:-3px}
#sel-bar .ci svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
#sel-bar button{display:inline-flex;align-items:center}

/* ── Мобильная раскладка: узкий экран (телефон + узкое окно Telegram на десктопе).
   Рельс уезжает вниз горизонтальной панелью, контент на всю ширину, шапка ниже
   плавающих кнопок Telegram. Десктоп и iPad (широкие) не затрагиваются. ── */
@media (max-width: 760px) {
  .layout { flex-direction: column-reverse; }
  .rail {
    width: 100%; height: auto; flex-direction: row; align-items: center; gap: 2px;
    padding: 4px 6px calc(env(safe-area-inset-bottom, 0px) + 4px);
    border-right: none; border-top: 1px solid #dcd1bd; box-shadow: 0 -1px 12px rgba(60,50,35,.05);
    overflow-x: auto;
  }
  .rail::-webkit-scrollbar { display: none; }
  .rail .logo, .rail-foot { display: none; }
  .rail nav { flex-direction: row; gap: 2px; width: 100%; justify-content: space-around; }
  .rbtn { width: auto; flex: 1 1 0; min-width: 54px; height: 52px; gap: 3px; }
  .rbtn svg { width: 19px; height: 19px; }
  .rbtn span { font-size: 9.5px; }
  .topbar { padding: calc(var(--tg-top, 0px) + 10px) 16px 10px; gap: 10px; }
  .tb-logo { width: 34px; height: 34px; }
  .tb-title { font-size: 17px; }
  .tb-meta, .tb-sub { display: none; }
  .content { padding: 16px 14px 24px; }
  .brain-body { grid-template-columns: 1fr; }        /* Мозг: две колонки → в стопку */
  .brain-reader { max-height: none; }
  /* Обзор: Pulse/Цели/Проекты в ряд не влезают на телефоне → в столбик
     (иначе три карточки шире экрана, вебвью зумит всю страницу — «всё мелкое») */
  .ov-bottom { flex-direction: column; gap: 12px; }
  .pulse-ring { width: 92px; height: 92px; }
  /* Двухколоночные разделы: сайдбар над контентом, обе секции на всю ширину */
  .chat-body, .ob-body, .doc-layout { flex-direction: column; gap: 12px; height: auto; }
  .chat-list, .ob-list, .doc-toc { width: 100%; flex-shrink: 1; }
  .doc-toc { position: static; }
  .ob-reader { padding: 18px; }
  /* Панели с кучей кнопок переносим, чтобы не выпирали за край экрана */
  .compose { flex-wrap: wrap; }
  .head-row { flex-wrap: wrap; row-gap: 6px; }
  /* Карточки-плитки на телефоне: крупные — в 2 колонки, мелкие — в 3,
     иначе minmax(280px) даёт одну колонку и бесконечную ленту (Алекс 28.08) */
  .projects, .prod-grid, .ag-arch-grid, .ag-agents, .tool-grid, .dept-grid,
  .lab-gallery, .kpi-grid, .acc-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .folder-tiles, .body-gallery, .lib-grid { grid-template-columns: repeat(3, 1fr); gap: 10px; }
  .prod-card { padding: 9px 10px; }
  .prod-foot .prod-act, .prod-chat-btn { font-size: 11px; padding: 7px 6px; }
}

/* Кнопка «на домашний экран» в шапке (видна только в Telegram, где поддерживается) */
.tb-home { margin-left: auto; background: rgba(201,162,39,.15); border: 1px solid rgba(201,162,39,.45); color: var(--text); border-radius: 12px; padding: 7px 13px; font-size: 13px; font-weight: 500; cursor: pointer; white-space: nowrap; }
.tb-home:hover { background: rgba(201,162,39,.25); }

/* Вложения в чат: панель чипов + кнопка скрепки */
.attach-bar { display: flex; flex-wrap: wrap; gap: 6px; padding: 6px 12px 0; }
.att-chip { background: rgba(201,162,39,.12); border: 1px solid rgba(201,162,39,.4); border-radius: 10px; padding: 4px 9px; font-size: 12px; display: inline-flex; align-items: center; gap: 7px; }
.att-chip b { cursor: pointer; opacity: .55; font-weight: 700; }
.att-chip b:hover { opacity: 1; color: #b5543a; }
#chat-attach svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.msg-att { font-size: 11.5px; opacity: .7; margin-top: 4px; }

/* «Цели» на Обзоре видят все; личный Пульс — только админ (Федор 20.08:
   кутёж-метр заменён на реальные цели с прогрессом) */
body.role-member .home-pulse { display: none; }

/* ── Офис: под-вкладки и карточки статистики (Федор 21.08 — раздельно и красиво) ── */
.ofc-tabs { display: flex; gap: 8px; margin: 2px 0 16px; }
.ofc-tab { padding: 9px 22px; border-radius: 999px; border: 1px solid var(--line); background: transparent; font: inherit; font-size: 13.5px; font-weight: 600; cursor: pointer; color: var(--muted); transition: all .2s; }
.ofc-tab:hover { border-color: var(--gold, #c9a227); color: var(--ink, inherit); }
.ofc-tab.on { background: var(--gold, #c9a227); border-color: var(--gold, #c9a227); color: #fff; box-shadow: 0 6px 18px rgba(201,162,39,.3); }
.stat-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (max-width: 900px) { .stat-grid { grid-template-columns: 1fr; } }
.stat-card { border-radius: 16px; padding: 20px 22px; }
.stat-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 14px; }
.stat-head b { font-size: 15px; }
.stat-live { font-size: 11px; padding: 3px 10px; border-radius: 99px; background: rgba(128,128,128,.12); color: var(--muted); }
.stat-live.hot { background: rgba(95,158,119,.16); color: #4c8664; }
.stat-nums { display: flex; gap: 22px; flex-wrap: wrap; margin-bottom: 12px; }
.stat-num b { display: block; font-size: 26px; font-weight: 700; line-height: 1.1; }
.stat-num.gold b { color: var(--gold, #c9a227); }
.stat-num span { font-size: 11.5px; color: var(--muted); }
.stat-row { display: flex; align-items: center; gap: 10px; font-size: 12.5px; padding: 5px 0; border-top: 1px solid var(--line); }
.stat-row b { min-width: 110px; font-weight: 600; }
.stat-bar { flex: 1; height: 6px; border-radius: 99px; background: rgba(128,128,128,.15); overflow: hidden; }
.stat-bar i { display: block; height: 100%; border-radius: 99px; background: linear-gradient(90deg, var(--gold, #c9a227), #5f9e77); }
.stat-row small { color: var(--muted); white-space: nowrap; }
.tool-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 14px; }
.tool-card { border-radius: 14px; padding: 16px 18px; }
.tool-card b { font-size: 14px; display: block; }
.tool-kind { display: inline-block; font-size: 10.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--gold, #b08d3e); margin: 4px 0 8px; }
.tool-card p { font-size: 12.5px; color: var(--muted); line-height: 1.5; }
.pipe-flow { counter-reset: pf; display: grid; gap: 0; margin-top: 16px; }
.pipe-step { position: relative; padding: 12px 0 12px 44px; border-left: 2px solid var(--line); margin-left: 15px; }
.pipe-step::before { counter-increment: pf; content: counter(pf); position: absolute; left: -16px; top: 10px; width: 30px; height: 30px; border-radius: 50%; background: var(--gold, #c9a227); color: #fff; font-weight: 700; font-size: 13px; display: flex; align-items: center; justify-content: center; }
.pipe-step b { font-size: 13.5px; }
.pipe-step p { font-size: 12.5px; color: var(--muted); }
/* отделы офиса: карточки с ботами и действиями (Федор 21.08 — разделы, не журнал) */
.dept-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 14px; }
.dept-card { border-radius: 14px; padding: 16px 18px; }
.dept-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.dept-head b { font-size: 14px; }
.dept-bots { display: flex; gap: 6px; flex-wrap: wrap; margin: 8px 0 4px; }
.bot-chip { font-size: 11px; padding: 3px 10px; border-radius: 99px; background: rgba(95,158,119,.12); border: 1px solid rgba(95,158,119,.35); }
.dept-does { font-size: 12px; color: var(--muted); margin-bottom: 8px; }
.dept-feed { border-top: 1px solid var(--line); padding-top: 6px; }
.dept-card.open .dept-feed { max-height: 240px; overflow-y: auto; }
.dept-more { font-size: 12px; color: var(--gold, #b08d3e); cursor: pointer; padding-top: 8px; }
.dept-more:hover { text-decoration: underline; }
/* живая лента офиса + drill-down по городу */
.feed-list { max-height: 260px; overflow-y: auto; }
.feed-row { display: flex; gap: 10px; align-items: baseline; font-size: 12.5px; padding: 4px 0; border-top: 1px solid var(--line); }
.feed-row:first-child { border-top: none; }
.feed-t { color: var(--muted); font-size: 11px; white-space: nowrap; min-width: 74px; }
.feed-d { font-weight: 600; white-space: nowrap; min-width: 150px; }
.feed-x { color: var(--muted); }
.cat-row { display: flex; gap: 6px; flex-wrap: wrap; padding: 8px 0; }
.cat-chip { font-size: 11.5px; padding: 3px 10px; border-radius: 99px; background: rgba(201,162,39,.12); border: 1px solid rgba(201,162,39,.35); }
.cat-chip.muted { background: rgba(128,128,128,.1); border-color: var(--line); color: var(--muted); }
.cd-lead { font-size: 12.5px; padding: 6px 0; border-top: 1px dashed var(--line); }
.cd-niche { color: var(--muted); font-size: 11.5px; }
.cd-status { font-size: 11px; padding: 1px 8px; border-radius: 99px; background: rgba(95,158,119,.15); margin-left: 6px; }
.cd-note { color: var(--muted); font-size: 11.5px; margin-top: 2px; }
.cd-ymap { font-size: 11px; margin-left: 6px; color: #d8a527; text-decoration: none; border-bottom: 1px dotted rgba(216,165,39,.5); }
.cd-ymap:hover { border-bottom-style: solid; }
/* лендинги в работе: бегунки статусов производства */
.prod-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 12px; margin-bottom: 18px; }
.prod-card { padding: 12px 16px; border-radius: 14px; }
.prod-top { font-size: 13px; }
.prod-bar { height: 6px; border-radius: 99px; background: rgba(128,128,128,.18); margin: 9px 0 7px; overflow: hidden; }
.prod-bar i { display: block; height: 100%; border-radius: 99px; background: #d8a527; transition: width .6s ease; }
.prod-bar i.high { background: #7fb069; }
.prod-bar i.full { background: #5f9e77; }
.prod-stage { font-size: 12px; color: var(--muted); }
.prod-stage a { color: #d8a527; text-decoration: none; border-bottom: 1px dotted rgba(216,165,39,.5); }
/* галерея лендингов с превью */
.lab-gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 14px; }
.lab-card { display: block; border-radius: 14px; overflow: hidden; transition: transform .25s, box-shadow .25s; }
.lab-card:hover { transform: translateY(-3px); box-shadow: 0 16px 40px rgba(60,50,35,.16); }
.lab-card img { width: 100%; aspect-ratio: 16/10; object-fit: cover; object-position: top; display: block; }
.lab-noimg { aspect-ratio: 16/10; display: flex; align-items: center; justify-content: center; color: var(--muted); font-size: 12.5px; background: rgba(128,128,128,.08); }
.lab-meta { padding: 10px 14px; }
.lab-meta b { display: block; font-size: 13px; }
.lab-meta span { font-size: 11.5px; color: var(--muted); }

/* ── Картинки от Гриффита в чате (app_reply --img): грузятся fetch'ем в blob ── */
.msg .msg-img { display: block; max-width: 100%; border-radius: 10px; margin-top: 8px; }

/* ── «Узел» на Обзоре: слим-строка пульса служб от watchdog ── */
.home-node { display: flex; align-items: center; gap: 14px; padding: 12px 18px; margin-bottom: 18px; font-size: 13.5px; }
.home-node .hn-title { font-weight: 600; flex: none; }
.home-node .hn-list { display: flex; flex-wrap: wrap; gap: 6px 16px; color: var(--ink-soft, inherit); }
.home-node .hn-svc { display: inline-flex; align-items: center; white-space: nowrap; }
.home-node .hn-stale { opacity: .65; font-size: 12px; }

/* ── Тост «отменить отправку» (терминал): плавает над композером 10 секунд ── */
.unsend-toast { position: absolute; bottom: 74px; left: 50%; transform: translateX(-50%);
  display: flex; align-items: center; gap: 10px; padding: 8px 14px; border-radius: 14px;
  background: rgba(40,40,40,.82); color: #fff; backdrop-filter: blur(10px); z-index: 40;
  box-shadow: 0 6px 22px rgba(0,0,0,.18); font-size: 13.5px; }
.unsend-toast button { background: none; border: none; color: #ffd479; font: inherit; font-weight: 600; cursor: pointer; padding: 0; }
.unsend-toast .unsend-sec { opacity: .65; min-width: 18px; text-align: center; }
.chat-main { position: relative; }

/* ── Мобильный чат (телефон ≤760px): список чатов — лентой сверху, пузыри во всю ширину,
   композер в одну строку. Раньше .chat-list (200px) зажимал ленту в столбик из слов. ── */
@media (max-width: 760px) {
  .chat-body { flex-direction: column; gap: 10px; }
  .chat-list { width: 100%; flex-direction: row; overflow-x: auto; padding: 6px; gap: 4px; align-self: stretch; }
  .chat-list::-webkit-scrollbar { display: none; }
  .chat-item { width: auto; flex: none; white-space: nowrap; padding: 8px 12px; font-size: 13px; }
  .chat-log { height: calc(100dvh - 350px); margin-bottom: 10px; }
  .msg { max-width: 92%; font-size: 14.5px; }
  .msg-meta .chip { font-size: 10.5px; }
  .compose { flex-wrap: nowrap; gap: 6px; }
  .cmd-wrap { flex: 1 1 auto; min-width: 0; }
  .compose > button { flex: none; }
  #chat-send { padding: 9px 13px; font-size: 13px; }
  /* озвучка и созвон на телефоне прячутся — место отдаём полю ввода */
  #chat-tts, #chat-call { display: none; }
  .unsend-toast { bottom: 92px; width: max-content; max-width: 92%; }
  /* шапка: в Telegram слева плавает «Закрыть» — уводим заголовок из-под неё */
  html.in-telegram .topbar { padding-left: 104px; }
  /* панель «Узел» на Обзоре: компактнее */
  .home-node { flex-direction: column; align-items: flex-start; gap: 8px; padding: 10px 14px; }
  .ov-bottom { flex-direction: column; }
}

/* ── Мобильный чат v2 (по просьбе Алекса 09.08): во весь экран + крупнее ── */
@media (max-width: 760px) {
  /* на вкладке Чат прячем верхнюю шапку и заголовок — как в телеграме, только лента */
  body[data-tab='chat'] .topbar { display: none; }
  body[data-tab='chat'] .content { padding: calc(var(--tg-top, 0px) + 8px) 10px 10px; }
  #tab-chat .head-row { margin: 0 0 8px; }
  #tab-chat .head-row h1, #tab-chat #chat-topic { display: none; }
  #tab-chat #chat-model { margin-left: auto; }
  .chat-log { height: calc(100dvh - var(--tg-top, 0px) - 250px); }
  /* крупнее и под палец */
  .msg { font-size: 15.5px; padding: 12px 15px; }
  .chat-item { font-size: 14px; padding: 10px 14px; }
  .compose input, #chat-input { font-size: 16px; }   /* ≥16px = iOS не зумит поле при фокусе */
  #chat-send { padding: 10px 15px; font-size: 14px; }
  #chat-attach { min-width: 44px; min-height: 44px; }
}

/* ── Цепочка апрува: стеклянные кнопки вердикта (светлая тема, 13.08) ─────────
   Тонированное стекло с blur, внутренний блик, цветное свечение и бегущий
   перелив; текст цветной — на слоновой кости белый не читается. */
.cf-act { border-top: 1px solid rgba(128,128,128,.22); margin-top: 18px; padding-top: 14px; }
.cf-lab { font-size: 10.5px; letter-spacing: .18em; text-transform: uppercase; opacity: .6; font-weight: 600; margin-bottom: 9px; }
.cf-ta { width: 100%; box-sizing: border-box; padding: 10px 13px; border-radius: 13px; border: 1px solid rgba(120,110,95,.3);
  background: linear-gradient(160deg, rgba(255,255,255,.6), rgba(255,255,255,.25)); backdrop-filter: blur(10px);
  color: inherit; font: inherit; resize: vertical; outline: none; transition: border-color .2s; }
.cf-ta:focus { border-color: rgba(80,70,55,.5); }
.cf-row { display: flex; gap: 10px; margin-top: 10px; }
.cf-btn { position: relative; overflow: hidden; flex: 1; padding: 12px 10px; border-radius: 14px;
  font: inherit; font-weight: 650; letter-spacing: .01em; cursor: pointer;
  border: 1px solid transparent; backdrop-filter: blur(12px) saturate(1.4);
  transition: transform .13s ease, box-shadow .25s ease, filter .2s ease; }
.cf-btn::after { content: ''; position: absolute; inset: -1px; pointer-events: none;
  background: linear-gradient(115deg, transparent 30%, rgba(255,255,255,.55) 47%, transparent 64%);
  transform: translateX(-130%) skewX(-8deg); animation: cf-sheen 3.6s ease-in-out infinite; }
.cf-btn.no::after { animation-delay: .6s; }
.cf-btn.cm::after { animation-delay: 1.2s; }
@keyframes cf-sheen { 0% { transform: translateX(-130%) skewX(-8deg); } 55%, 100% { transform: translateX(130%) skewX(-8deg); } }
.cf-btn.ok { color: #14713f; border-color: rgba(52,178,110,.5);
  background: linear-gradient(155deg, rgba(84,214,146,.38), rgba(84,214,146,.1) 62%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.65), 0 8px 22px rgba(52,178,110,.22); }
.cf-btn.no { color: #a02f2f; border-color: rgba(214,86,86,.5);
  background: linear-gradient(155deg, rgba(244,120,120,.34), rgba(244,120,120,.08) 62%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.6), 0 8px 22px rgba(206,84,84,.2); }
.cf-btn.cm { color: #3b4bb0; border-color: rgba(110,128,226,.5);
  background: linear-gradient(155deg, rgba(140,158,255,.32), rgba(140,158,255,.08) 62%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.6), 0 8px 22px rgba(110,128,226,.2); }
.cf-btn:hover { filter: brightness(1.05) saturate(1.15); }
.cf-btn:active { transform: scale(.96); }

/* ── Журнал ночного цикла: сворачиваемый (просьба Федора 13.08) ── */
details.brain-log-wrap > summary.brain-log-toggle { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 8px; margin: 0; user-select: none; }
details.brain-log-wrap > summary.brain-log-toggle::-webkit-details-marker { display: none; }
details.brain-log-wrap .chev { width: 8px; height: 8px; border-right: 1.6px solid currentColor; border-bottom: 1.6px solid currentColor; transform: rotate(-45deg); opacity: .55; transition: transform .25s ease; margin-left: 2px; }
details.brain-log-wrap[open] .chev { transform: rotate(45deg); }
details.brain-log-wrap .brain-log { margin-top: 10px; }

/* ── Мозг: сворачиваемая левая колонка (Федор 13.08) ── */
.brain-side { position: relative; }
.brain-side-btn { position: absolute; top: 10px; right: 10px; width: 28px; height: 28px; border-radius: 9px; font-size: 14px; line-height: 1; padding: 0; }
/* свёрнутое состояние — узкая рейка, кнопка остаётся НАВЕРХУ на своём месте (Федор 13.08) */
#brain-body.side-collapsed { grid-template-columns: 44px 1fr; }
#brain-body.side-collapsed .brain-side { padding: 8px 6px; }
#brain-body.side-collapsed .brain-side > *:not(.brain-side-btn) { display: none; }
#brain-body.side-collapsed .brain-side-btn { position: static; display: block; margin: 2px auto; }

/* ── Чат: страница неподвижна, листается только лента сообщений (Федор 13.08) ── */
.content:has(#tab-chat:not(.hidden)) { overflow: hidden; padding-bottom: 16px; }
#tab-chat:not(.hidden) { display: flex; flex-direction: column; height: 100%; min-height: 0; }
#tab-chat .head-row { flex-shrink: 0; }
#tab-chat .chat-body { flex: 1; min-height: 0; }
#tab-chat .chat-list { max-height: 100%; overflow-y: auto; }
#tab-chat .chat-main { display: flex; flex-direction: column; min-height: 0; }
#tab-chat .chat-log { flex: 1; height: auto; min-height: 0; }
#tab-chat .compose, #tab-chat .attach-bar { flex-shrink: 0; }

/* ── Очередь «На апруве»: выпадающий список вместо плиток (Федор 13.08) ── */
.cf-select { width: 100%; max-width: 640px; padding: 11px 14px; border-radius: 13px; font: inherit; font-size: 13.5px;
  border: 1px solid rgba(201,162,39,.45); background: rgba(255,255,255,.8); color: var(--text); outline: none; cursor: pointer; }
.cf-select:focus { border-color: rgba(160,125,25,.7); }

/* ── «Страница не листается НИГДЕ» (Федор 13.08): вкладка заполняет экран,
   скроллятся только внутренние окна (читалка карточки, лента, списки). ── */
.content { overflow: hidden; padding-bottom: 16px; }
.tab:not(.hidden) { display: flex; flex-direction: column; height: 100%; min-height: 0; overflow-y: auto; -webkit-overflow-scrolling: touch; padding-bottom: 22px; }
/* momentum-скролл внутренним зонам. touch-action НЕ трогаем: pan-y глушил горизонтальные
   свайпы (табы, карусели) — модель прокрутки теперь страничная, pan-y больше не нужен (Алекс 28.08) */
.chat-log, #tab-chat .chat-body, .chat-list, .ob-reader, .ob-list, .brain-reader, .brain-cards, .doc { -webkit-overflow-scrolling: touch; }
/* у чата и мозга свои внутренние скролл-зоны — сама вкладка не листается */
#tab-chat:not(.hidden), #tab-brain:not(.hidden) { overflow-y: hidden; }
.tab .head-row { flex-shrink: 0; }

/* Мозг: читалка карточки тянется на всю оставшуюся высоту и скроллится сама */
#tab-brain .brain-body { flex: 1; min-height: 0; margin-bottom: 10px; }
#tab-brain .brain-side { overflow-y: auto; min-height: 0; }
#tab-brain .brain-main { min-height: 0; }
#tab-brain .brain-cards { flex-shrink: 0; max-height: 30vh; overflow-y: auto; }
#tab-brain .brain-reader { flex: 1; min-height: 0; max-height: none; }
#tab-brain .brain-log-wrap { flex-shrink: 0; }

/* ── Селекты: нативный вид заменён на дизайн-код ВЕЗДЕ (Федор 13.08: «кривая полоска») ── */
select {
  appearance: none; -webkit-appearance: none; -moz-appearance: none;
  padding: 9px 36px 9px 14px; border-radius: 12px; border: 1px solid var(--line);
  background: rgba(255,255,255,.82) url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 4.5L6 8l3.5-3.5' fill='none' stroke='%238b8577' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 13px center / 12px;
  font: inherit; font-size: 13px; color: var(--text); cursor: pointer; outline: none;
  transition: border-color .15s, box-shadow .15s;
}
select:hover { border-color: rgba(201,162,39,.45); }
select:focus { border-color: rgba(160,125,25,.6); box-shadow: 0 0 0 3px rgba(201,162,39,.12); }

/* ── Читалка карточки: комменты к выделенному (Notion-лайт) + прыжок к вердикту ── */
.cf-jump { position: sticky; bottom: 12px; float: right; margin-right: 6px; z-index: 5;
  border: 1px solid rgba(201,162,39,.5); border-radius: 99px; padding: 8px 16px; font: inherit; font-size: 12.5px;
  font-weight: 600; color: var(--gold, #8a6d1f); background: rgba(255,255,255,.9); backdrop-filter: blur(8px);
  cursor: pointer; box-shadow: 0 6px 18px rgba(60,50,35,.12); transition: transform .12s; }
.cf-jump:hover { transform: translateY(-1px); }
.cf-selbtn { position: absolute; z-index: 40; border: none; border-radius: 10px; padding: 7px 13px;
  font: inherit; font-size: 12.5px; font-weight: 600; color: #fff; background: #33302b; cursor: pointer;
  box-shadow: 0 8px 20px rgba(0,0,0,.2); }
.cf-selbtn:hover { background: #4a4438; }
blockquote.cf-q { border-left: 3px solid rgba(201,162,39,.55); margin: 6px 0; padding: 3px 12px; color: #6b6558; font-style: italic; }

/* ── Офис (Ф1-Ф5): конвейер канбаном — 4 колонки, глубина как в v2-мокапе ── */
.office-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 13px; flex: 1; min-height: 0; }
@media (max-width: 1250px) { .office-grid { grid-template-columns: repeat(2, 1fr); overflow-y: auto; } }
@media (max-width: 760px) { .office-grid { grid-template-columns: 1fr; } }
.ofc { position: relative; padding: 16px 15px; min-height: 0; overflow-y: auto; max-height: 100%;
  border: 1px solid rgba(255,255,255,.55); box-shadow: inset 0 1px 0 rgba(255,255,255,.6), 0 14px 34px rgba(60,50,35,.06); }
.ofc::before { content: ''; position: absolute; left: 18px; right: 18px; top: 0; height: 2px; border-radius: 2px;
  background: linear-gradient(90deg, transparent, rgba(201,162,39,.6), transparent); }
.ofc > h3 { position: sticky; top: -16px; z-index: 2; background: inherit; padding: 4px 0 8px; margin: -4px 0 8px; backdrop-filter: blur(6px); }
.ofc h3 b { margin-left: auto; color: #8a6d1f; font-variant-numeric: tabular-nums; background: rgba(201,162,39,.12);
  border: 1px solid rgba(201,162,39,.3); border-radius: 99px; padding: 1px 9px; font-size: 11px; }
.ofc h3 { display: flex; align-items: center; }
.ofc-item { border: 1px solid rgba(60,50,35,.08); border-radius: 14px; padding: 13px 14px; margin-bottom: 10px;
  background: rgba(255,255,255,.66); box-shadow: inset 0 1px 0 rgba(255,255,255,.7), 0 6px 18px rgba(60,50,35,.05);
  transition: transform .22s cubic-bezier(.22,1,.36,1), box-shadow .22s; animation: ofcrise .5s cubic-bezier(.22,1,.36,1) both; }
.ofc-item:nth-child(2) { animation-delay: .05s; } .ofc-item:nth-child(3) { animation-delay: .1s; }
.ofc-item:nth-child(4) { animation-delay: .15s; } .ofc-item:nth-child(5) { animation-delay: .2s; }
@keyframes ofcrise { from { opacity: 0; transform: translateY(10px); } }
.ofc-item:hover { transform: translateY(-3px); box-shadow: inset 0 1px 0 rgba(255,255,255,.7), 0 14px 30px rgba(60,50,35,.1); }
.ofc-item .t { font-size: 13px; font-weight: 600; display: flex; align-items: baseline; gap: 8px; line-height: 1.4; flex-wrap: wrap; }
.ofc-item .t .n { color: #fff; background: linear-gradient(150deg, #c9a227, #8a6d1f); border-radius: 8px; padding: 1px 8px;
  font-weight: 700; font-size: 11px; flex-shrink: 0; box-shadow: 0 3px 8px rgba(138,109,31,.3); }
.ofc-item .meta { font-size: 11.5px; color: var(--muted); margin-top: 3px; }
.ofc-item .meta a { color: #8a6d1f; }
.ofc-badge { font-size: 9.5px; letter-spacing: .08em; text-transform: uppercase; font-weight: 650; border-radius: 99px; padding: 3px 10px; margin-left: auto; flex-shrink: 0; }
.ofc-badge.wait { background: rgba(217,161,60,.14); color: #a0762a; border: 1px solid rgba(217,161,60,.4); }
.ofc-badge.done { background: rgba(76,157,110,.12); color: #2f7a52; border: 1px solid rgba(76,157,110,.35); }
.ofc-badge.dead { background: rgba(60,50,35,.06); color: var(--muted); border: 1px solid rgba(60,50,35,.14); }
.ofc-actions { display: flex; gap: 8px; margin-top: 10px; }
.ofc-btn { position: relative; overflow: hidden; flex: 1; max-width: 130px; padding: 8px 10px; border-radius: 11px; font: inherit; font-size: 12px; font-weight: 600; cursor: pointer;
  border: 1px solid transparent; backdrop-filter: blur(10px) saturate(1.3); transition: transform .12s, filter .2s; }
.ofc-btn:hover { filter: brightness(1.06) saturate(1.1); } .ofc-btn:active { transform: scale(.96); }
.ofc-btn.ok { color: #14713f; border-color: rgba(52,178,110,.5); background: linear-gradient(155deg, rgba(84,214,146,.36), rgba(84,214,146,.08) 62%); box-shadow: inset 0 1px 0 rgba(255,255,255,.6); }
.ofc-btn.no { color: #a02f2f; border-color: rgba(214,86,86,.5); background: linear-gradient(155deg, rgba(244,120,120,.3), rgba(244,120,120,.07) 62%); box-shadow: inset 0 1px 0 rgba(255,255,255,.55); }
.ofc-btn.alt { color: #3b4bb0; border-color: rgba(110,128,226,.5); background: linear-gradient(155deg, rgba(140,158,255,.3), rgba(140,158,255,.07) 62%); box-shadow: inset 0 1px 0 rgba(255,255,255,.55); }
.ofc-more { font-size: 12px; color: #8a6d1f; cursor: pointer; margin-top: 8px; display: inline-block; }
.ofc-body { display: none; margin-top: 10px; font-size: 12.5px; line-height: 1.6; color: #575047; white-space: pre-wrap; border-top: 1px solid rgba(60,50,35,.08); padding-top: 10px; }
.ofc-item.open .ofc-body { display: block; }
.ofc .muted { font-size: 13px; }

/* ── Офис v2: направления → канбан по статусам (Федор, голосовое 19.08) ── */
#office-sections { display: flex; gap: 9px; margin-bottom: 14px; flex-shrink: 0; flex-wrap: wrap; }
.ofc-sec { display: flex; align-items: center; gap: 8px; border: 1px solid rgba(60,50,35,.14); border-radius: 13px;
  background: rgba(255,255,255,.55); color: var(--text); padding: 9px 16px; font: inherit; font-size: 13.5px; font-weight: 600;
  cursor: pointer; transition: .15s; backdrop-filter: blur(8px); }
.ofc-sec:hover { border-color: rgba(201,162,39,.45); }
.ofc-sec.active { border-color: rgba(201,162,39,.6); background: rgba(201,162,39,.1); color: #6d5518; }
.ofc-sec b { font-size: 11px; background: rgba(201,162,39,.14); border: 1px solid rgba(201,162,39,.3); color: #8a6d1f;
  border-radius: 99px; padding: 1px 8px; font-variant-numeric: tabular-nums; }
.office-board { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(230px, 1fr); gap: 13px; flex: 1; min-height: 0; overflow-x: auto; padding-bottom: 6px; }
.ofc-col { padding: 14px; min-height: 0; overflow-y: auto; border: 1px solid rgba(255,255,255,.55);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.6), 0 14px 34px rgba(60,50,35,.06); }
.ofc-col > h3 { display: flex; align-items: center; margin-top: 0; }
.ofc-col > h3 b { margin-left: auto; color: #8a6d1f; background: rgba(201,162,39,.12); border: 1px solid rgba(201,162,39,.3);
  border-radius: 99px; padding: 1px 8px; font-size: 11px; font-variant-numeric: tabular-nums; }
.ofc-day { font-size: 10px; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); font-weight: 700; margin: 12px 0 7px; }
.ofc-day:first-of-type { margin-top: 2px; }
.ofc-card { border: 1px solid rgba(60,50,35,.08); border-radius: 13px; padding: 11px 13px; margin-bottom: 8px; cursor: pointer;
  background: rgba(255,255,255,.66); box-shadow: inset 0 1px 0 rgba(255,255,255,.7), 0 5px 14px rgba(60,50,35,.05);
  transition: transform .2s cubic-bezier(.22,1,.36,1), box-shadow .2s; }
.ofc-card:hover { transform: translateY(-2px); box-shadow: inset 0 1px 0 rgba(255,255,255,.7), 0 12px 26px rgba(60,50,35,.1); }
.occ-t { font-size: 12.5px; font-weight: 600; line-height: 1.4; display: flex; gap: 7px; align-items: baseline; }
.occ-t .n { color: #fff; background: linear-gradient(150deg, #c9a227, #8a6d1f); border-radius: 7px; padding: 1px 7px;
  font-weight: 700; font-size: 10.5px; flex-shrink: 0; }
.occ-m { font-size: 11px; color: var(--muted); margin-top: 5px; display: flex; align-items: baseline; gap: 6px; }
.occ-time { margin-left: auto; font-variant-numeric: tabular-nums; }

/* модалка деталей */
.ofc-modal { position: fixed; inset: 0; z-index: 80; background: rgba(40,35,28,.35); backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px);
  display: flex; align-items: center; justify-content: center; padding: 4vh 4vw; animation: ofcfade .2s ease; }
@keyframes ofcfade { from { opacity: 0; } }
.ofc-modal-card { width: min(640px, 100%); max-height: 88vh; overflow-y: auto; padding: 22px 24px; border-radius: 18px;
  background: #faf7f1; border: 1px solid rgba(60,50,35,.12); box-shadow: 0 30px 70px rgba(46,43,37,.22);
  animation: ofcup .28s cubic-bezier(.22,1,.36,1); }
@keyframes ofcup { from { opacity: 0; transform: translateY(16px); } }
.omc-head { display: flex; align-items: flex-start; gap: 12px; }
.omc-head b { font-size: 15px; line-height: 1.4; }
.omc-x { margin-left: auto; border: none; background: none; font-size: 15px; cursor: pointer; color: var(--muted); flex-shrink: 0; }
.omc-status { font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: #8a6d1f; font-weight: 650; margin: 7px 0 13px; }
.omc-body { font-size: 13.5px; line-height: 1.65; white-space: pre-wrap; color: #46413a; }
.omc-body a { color: #8a6d1f; word-break: break-all; }
.ofc-modal .ofc-actions { margin-top: 16px; }

/* ── UI-полировка 22.08 (задача Федора: «применить новые визуальные эффекты») ── */
/* живой фон: два тёплых блоба медленно дрейфуют за контентом */
.bg::before, .bg::after {
  content: ''; position: absolute; border-radius: 50%; filter: blur(80px); opacity: .5;
  will-change: transform;
}
.bg::before {
  width: 560px; height: 560px; top: -180px; right: -120px;
  background: radial-gradient(circle, rgba(200, 163, 77, .16), transparent 70%);
  animation: blobA 46s ease-in-out infinite alternate;
}
.bg::after {
  width: 480px; height: 480px; bottom: -160px; left: -100px;
  background: radial-gradient(circle, rgba(125, 154, 134, .14), transparent 70%);
  animation: blobB 38s ease-in-out infinite alternate;
}
@keyframes blobA { from { transform: translate(0, 0) scale(1); } to { transform: translate(-90px, 70px) scale(1.15); } }
@keyframes blobB { from { transform: translate(0, 0) scale(1.1); } to { transform: translate(80px, -60px) scale(.95); } }

/* карточки: мягкий подъём при наведении */
.glass { transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.glass:hover { transform: translateY(-2px); box-shadow: 0 14px 34px rgba(60, 50, 35, .12); border-color: #d9cbb2; }

/* активная вкладка в рейле: свечение в цвет раздела */
.rbtn { transition: background .2s, color .2s, box-shadow .3s, transform .15s; }
.rbtn:hover { transform: translateY(-1px); }
.rbtn:hover svg { transform: scale(1.08); }
.rbtn svg { transition: transform .2s ease; }
.rbtn.on { box-shadow: 0 0 0 1.5px color-mix(in srgb, var(--hc) 45%, transparent), 0 6px 18px color-mix(in srgb, var(--hc) 30%, transparent); }

/* кнопки: отклик на нажатие */
.cc-btn, .rbtn, button { transition: transform .12s ease, box-shadow .2s ease, background .2s ease; }
.cc-btn:active, .rbtn:active { transform: scale(.97); }
.cc-btn:hover { box-shadow: 0 6px 16px rgba(23, 23, 15, .18); }

/* поля ввода: тёплое фокус-кольцо */
input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: none; box-shadow: 0 0 0 2.5px rgba(200, 163, 77, .35); border-color: #c8a34d !important;
}

/* тонкие скроллбары в тон */
::-webkit-scrollbar { width: 9px; height: 9px; }
::-webkit-scrollbar-thumb { background: #d6c9b1; border-radius: 8px; border: 2px solid var(--bg0); }
::-webkit-scrollbar-thumb:hover { background: #c8b78f; }
::-webkit-scrollbar-track { background: transparent; }

/* модалки и панели появляются мягче */
.ofc-modal, .modal, [class*="detail"] { animation: softIn .28s ease backwards; }
@keyframes softIn { from { opacity: 0; transform: translateY(10px) scale(.985); } to { opacity: 1; transform: none; } }

/* доступность: без анимаций для тех, кто их выключил */
@media (prefers-reduced-motion: reduce) {
  .bg::before, .bg::after, .iri::after { animation: none !important; }
  .glass, .rbtn, .cc-btn { transition: none !important; }
}

/* ═══ Конвейер / Медиа / KPI-агенты / диалог лендинга (Алекс 24.08) ═══ */
/* сплит страниц статистики */
.stat-pages { display: flex; gap: 8px; margin: 4px 0 16px; flex-wrap: wrap; }

/* KPI-карточки агентов: онлайн/офлайн, задача, прогресс к порогу */
.kpi-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 14px; }
.kpi-card { padding: 16px 18px; border-radius: 16px; }
.kpi-head { display: flex; align-items: center; gap: 9px; }
.kpi-head b { font-size: 14.5px; }
.kpi-dot { width: 9px; height: 9px; border-radius: 50%; flex: none; background: var(--muted); }
.kpi-dot.on { background: #5f9e77; box-shadow: 0 0 0 3px rgba(95,158,119,.18); animation: kpiPulse 2s ease-in-out infinite; }
.kpi-dot.wait { background: #d8a527; box-shadow: 0 0 0 3px rgba(216,165,39,.18); }
.kpi-dot.off { background: #b9b1a1; }
@keyframes kpiPulse { 0%,100% { box-shadow: 0 0 0 3px rgba(95,158,119,.18); } 50% { box-shadow: 0 0 0 6px rgba(95,158,119,.05); } }
.kpi-state { margin-left: auto; font-size: 11px; padding: 3px 11px; border-radius: 99px; background: rgba(128,128,128,.12); color: var(--muted); font-weight: 600; }
.kpi-state.on { background: rgba(95,158,119,.16); color: #4c8664; }
.kpi-state.wait { background: rgba(216,165,39,.18); color: #8a6d1f; }
.kpi-dept { font-size: 12px; color: var(--muted); margin: 8px 0 3px; }
.kpi-task { font-size: 13px; margin: 4px 0 10px; }
.kpi-bar { height: 8px; border-radius: 99px; background: rgba(128,128,128,.18); overflow: hidden; }
.kpi-bar i { display: block; height: 100%; border-radius: 99px; background: #5f9e77; transition: width .6s ease; }
.kpi-bar i.full { background: #d8a527; }
.kpi-meta { display: flex; align-items: center; gap: 6px; font-size: 12.5px; margin: 8px 0 12px; }
.kpi-meta b { font-size: 15px; }
.kpi-acts { display: flex; gap: 8px; }
.kpi-acts .ofc-btn { max-width: none; }

/* превью сборки в карточке «Лендинги в работе» */
.prod-card { display: flex; flex-direction: column; }
.prod-prev { display: block; border-radius: 11px; overflow: hidden; margin-bottom: 10px; border: 1px solid var(--line); aspect-ratio: 16 / 10; background: rgba(0,0,0,.03); }
.prod-prev img { width: 100%; height: 100%; object-fit: cover; object-position: top; display: block; }
.prod-prev.noimg { display: flex; align-items: center; justify-content: center; font-size: 12px; color: var(--muted); }
.prod-foot { margin-top: 10px; display: flex; flex-wrap: wrap; gap: 7px; align-items: center; }
.prod-chat-btn { width: 100%; display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 9px 12px; border-radius: 10px; border: 1px solid var(--line); background: rgba(201,162,39,.07); color: #6d5518; font: inherit; font-size: 12.5px; font-weight: 600; cursor: pointer; transition: all .18s; }
.prod-chat-btn:hover { border-color: rgba(201,162,39,.5); background: rgba(201,162,39,.13); }
.prod-chat-btn svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
/* воронка: «Сдан» (призрачная) + «Продан» (заливка — главное действие) + бейдж продажи (Алекс 25.08) */
.prod-act { flex: 1 1 auto; padding: 8px 12px; border-radius: 10px; font: inherit; font-size: 12.5px; font-weight: 600; cursor: pointer; transition: all .18s; }
.prod-act.deliver { border: 1px solid var(--line); background: transparent; color: #5a5142; }
.prod-act.deliver:hover { border-color: var(--green); color: #4b7a52; background: rgba(134,169,128,.12); }
.prod-act.sell { border: 1px solid #5f9e77; background: #5f9e77; color: #fff; }
.prod-act.sell:hover { background: #548c69; border-color: #548c69; }
.prod-sold { flex: 1 1 100%; display: inline-flex; align-items: center; gap: 6px; padding: 8px 12px; border-radius: 10px; background: rgba(95,158,119,.14); color: #3f7a57; font-size: 12.5px; font-weight: 600; }
.prod-bar i.sold { background: linear-gradient(90deg,#5f9e77,#86a980); }
/* ── Офер в карточке (Алекс 25.08): письмо/мессенджер/скрипт звонка без прыжков по файлам ── */
.prod-act.offer { border: 1px solid var(--cyan); background: rgba(179,144,58,.10); color: #8a6d23; }
.prod-act.offer:hover { background: rgba(179,144,58,.18); border-color: #a5842f; }
/* ── Первое сообщение в карточке (Федор 18.09): текст без AI + отметки отправлено/ответил ── */
.prod-act.outreach { border: 1px solid #56b06a; background: rgba(86,176,106,.10); color: #2f8047; }
.prod-act.outreach:hover { background: rgba(86,176,106,.18); border-color: #3f9757; }
.prod-outreach { font-size: 12px; }
.prod-outreach.sent { color: #8a6d23; }
.prod-outreach.answered { color: #2f8047; font-weight: 600; }
.orm-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.orm-actions .prod-act { flex: 0 0 auto; }
.orm-actions .prod-act.sent { border: 1px solid var(--line); background: transparent; color: #5a5142; }
.orm-actions .prod-act.sent:hover { border-color: #a5842f; color: #8a6d23; background: rgba(179,144,58,.1); }
.orm-actions .prod-act.answered { border: 1px solid #5f9e77; background: #5f9e77; color: #fff; }
.orm-actions .prod-act.answered:hover { background: #548c69; border-color: #548c69; }
.orm-reset { margin-left: auto; border: none; background: transparent; color: var(--muted); font: inherit; font-size: 11.5px; text-decoration: underline; cursor: pointer; padding: 4px 2px; }
.orm-reset:hover { color: var(--text); }
.ofr-ov { position: fixed; inset: 0; z-index: 130; background: rgba(40,34,26,.5); backdrop-filter: blur(8px);
  display: flex; align-items: center; justify-content: center; padding: 20px; animation: softIn .2s ease; }
.ofr-modal { width: min(620px, 96vw); max-height: 88vh; display: flex; flex-direction: column;
  background: #fffdf8; border: 1px solid var(--line); border-radius: 18px; box-shadow: 0 30px 80px rgba(40,34,26,.35); overflow: hidden; }
.ofr-top { display: flex; align-items: center; gap: 10px; padding: 15px 18px; border-bottom: 1px solid var(--line); }
.ofr-top b { font-size: 15px; }
.ofr-x { margin-left: auto; border: none; background: transparent; font-size: 16px; color: var(--muted); cursor: pointer; line-height: 1; padding: 4px 7px; border-radius: 8px; }
.ofr-x:hover { background: rgba(0,0,0,.06); color: var(--text); }
.ofr-scroll { padding: 14px 18px 20px; overflow-y: auto; display: flex; flex-direction: column; gap: 14px; }
.ofr-meta { font-size: 12.5px; color: var(--text); }
.ofr-meta.muted { color: var(--muted); }
.ofr-meta a { color: var(--cyan); }
.ofr-sec { display: flex; flex-direction: column; gap: 6px; }
.ofr-h { display: flex; align-items: center; gap: 10px; font-size: 12.5px; font-weight: 700; color: var(--text); }
.ofr-copy { margin-left: auto; border: 1px solid var(--line); background: #fff; color: #6a6152; font: inherit; font-size: 11.5px; font-weight: 600; padding: 4px 10px; border-radius: 8px; cursor: pointer; transition: all .15s; }
.ofr-copy:hover { border-color: var(--cyan); color: #8a6d23; background: rgba(179,144,58,.08); }
.ofr-body { width: 100%; resize: vertical; border: 1px solid var(--line); border-radius: 12px; background: #fbf8f1;
  color: var(--text); font: inherit; font-size: 13px; line-height: 1.5; padding: 11px 13px; outline: none; white-space: pre-wrap; }
.ofr-body:focus { border-color: var(--cyan); }
.ofr-note { font-size: 12px; color: var(--muted); background: rgba(179,144,58,.08); border-radius: 10px; padding: 9px 12px; }
.ofr-contacts { background: rgba(134,169,128,.10); border: 1px solid rgba(134,169,128,.32); border-radius: 12px; padding: 11px 13px; }
.ofr-ch { font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: #5b7a54; font-weight: 700; margin-bottom: 8px; }
.ofr-crow { display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: center; }
.ofr-c { font-size: 13px; color: var(--text); }
.ofr-c.muted { color: var(--muted); }
.ofr-c a { color: #4b7a52; font-weight: 600; }
.ofr-cbtn { font-size: 12.5px; font-weight: 600; padding: 5px 11px; border-radius: 9px; border: 1px solid var(--line); background: #fff; color: #4b7a52; text-decoration: none; transition: all .15s; }
.ofr-cbtn:hover { border-color: var(--green); background: rgba(134,169,128,.12); }
.ofr-cbtn.wa { border-color: #56b06a; background: rgba(86,176,106,.14); color: #2f8047; }
.ofr-empty { text-align: center; color: var(--text); font-size: 13.5px; line-height: 1.7; padding: 16px 8px; }
.ofr-empty.muted { color: var(--muted); font-size: 12.5px; }
.ofr-gen { margin-top: 6px; border: 1px solid var(--cyan); background: rgba(179,144,58,.12); color: #8a6d23; font: inherit; font-size: 13px; font-weight: 600; padding: 9px 16px; border-radius: 10px; cursor: pointer; transition: all .15s; }
.ofr-gen:hover { background: rgba(179,144,58,.2); }
.ofr-gen:disabled { opacity: .6; cursor: default; }
/* модалка «Продан» — ввод суммы */
.sell-modal { position: fixed; inset: 0; z-index: 120; background: rgba(30,26,20,.5); backdrop-filter: blur(4px); display: flex; align-items: center; justify-content: center; padding: 24px; animation: softIn .24s ease; }
.sell-card { width: min(360px,100%); background: var(--panel); border: 1px solid var(--line); border-radius: 16px; padding: 22px; display: flex; flex-direction: column; gap: 7px; box-shadow: 0 24px 60px -20px rgba(30,26,20,.4); }
.sell-card b { font-size: 16px; }
.sell-amt { width: 100%; padding: 12px 14px; border: 1px solid var(--line); border-radius: 10px; font: inherit; font-size: 16px; background: rgba(0,0,0,.02); margin-top: 2px; transition: border-color .18s; }
.sell-amt:focus { outline: none; border-color: var(--green); }
.sell-row { display: flex; gap: 8px; margin-top: 10px; }
.sell-row button { flex: 1; padding: 11px; border-radius: 10px; font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; transition: all .18s; }
.sell-cancel { border: 1px solid var(--line); background: transparent; color: var(--muted); }
.sell-cancel:hover { border-color: var(--muted); }
.sell-ok { border: 1px solid #5f9e77; background: #5f9e77; color: #fff; }
.sell-ok:hover { background: #548c69; }

/* модалка правок лендинга: слева живой лендинг, справа чат с агентом сборки */
.ll-modal { position: fixed; inset: 0; z-index: 95; background: rgba(30,26,20,.5); backdrop-filter: blur(4px); display: flex; align-items: center; justify-content: center; padding: 24px; animation: softIn .28s ease; }
/* непрозрачное окно (перебиваем матовый .glass, иначе сквозь чат-колонку виден фон) */
.ll-modal-card { width: min(1080px, 96vw); height: min(720px, 90vh); display: flex; flex-direction: column; border-radius: 20px; overflow: hidden; padding: 0; background: var(--panel); border: 1px solid var(--line); backdrop-filter: none; box-shadow: 0 30px 80px rgba(30,26,20,.42); }
.llm-head { display: flex; align-items: center; gap: 10px; padding: 15px 20px; border-bottom: 1px solid var(--line); flex: none; }
.llm-head b { font-size: 15px; }
.llm-x { margin-left: auto; display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; padding: 0; box-sizing: border-box; border-radius: 9px; border: 1px solid var(--line); background: var(--panel); color: var(--muted); cursor: pointer; font-size: 15px; font-weight: 400; }
.llm-x:hover { color: var(--text); border-color: rgba(201,162,39,.5); }
.llm-body { display: flex; flex: 1; min-height: 0; }
.llm-preview { flex: 1.25; display: flex; flex-direction: column; border-right: 1px solid var(--line); background: #f0ece3; min-width: 0; }
.llm-preview.empty { align-items: center; justify-content: center; text-align: center; padding: 30px; font-size: 13px; }
.llm-prev-bar { display: flex; align-items: center; justify-content: space-between; padding: 8px 14px; font-size: 11.5px; color: var(--muted); border-bottom: 1px solid var(--line); background: var(--panel); flex: none; }
.llm-prev-bar a { color: #a5801d; text-decoration: none; border-bottom: 1px dotted rgba(165,128,29,.5); }
.llm-preview iframe { flex: 1; width: 100%; border: 0; background: #fff; }
.llm-chat { flex: 1; display: flex; flex-direction: column; min-width: 340px; }
@media (max-width: 820px) {
  .ll-modal-card { height: 92vh; }
  .llm-body { flex-direction: column; }
  .llm-preview { flex: none; height: 38%; border-right: 0; border-bottom: 1px solid var(--line); }
  .llm-chat { min-width: 0; flex: 1; }
}
.ll-log { flex: 1; overflow-y: auto; display: flex; flex-direction: column; gap: 8px; padding: 16px; }
.ll-msg { max-width: 90%; padding: 8px 12px; border-radius: 13px; font-size: 13.5px; line-height: 1.45; white-space: pre-wrap; word-break: break-word; }
.ll-msg.user { align-self: flex-end; background: var(--gold, #c9a227); color: #fff; }
.ll-msg.assistant { align-self: flex-start; background: rgba(60,50,35,.05); border: 1px solid var(--line); }
.ll-msg.pending { opacity: .6; font-style: italic; }
.ll-atts { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 16px; }
.ll-atts:not(:empty) { padding-bottom: 8px; }
.ll-att { font-size: 11.5px; background: rgba(0,0,0,.04); border: 1px solid var(--line); border-radius: 99px; padding: 2px 6px 2px 11px; display: inline-flex; align-items: center; gap: 4px; }
.ll-att button { border: none; background: none; cursor: pointer; color: var(--muted); font-size: 15px; line-height: 1; }
.ll-input { display: flex; align-items: center; gap: 8px; padding: 12px 14px; border-top: 1px solid var(--line); flex: none; }
.ll-input .ll-text { flex: 1; padding: 10px 14px; border: 1px solid var(--line); border-radius: 11px; font: inherit; font-size: 13.5px; background: var(--panel); color: var(--text); }
.ll-input .ll-text:focus { outline: none; border-color: rgba(201,162,39,.55); }
.ll-attach, .ll-send { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; padding: 0; box-sizing: border-box; border: 1px solid var(--line); background: var(--panel); border-radius: 11px; cursor: pointer; color: var(--muted); flex: none; }
.ll-send { background: var(--gold, #c9a227); border-color: var(--gold, #c9a227); color: #fff; }
.ll-attach svg, .ll-send svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.ll-send svg.fill { fill: currentColor; stroke: none; }
.ll-attach:hover { border-color: rgba(201,162,39,.5); color: var(--text); }
.ll-send:hover { filter: brightness(1.06); }

/* ═══ Звонки (Алекс 24.08) ═══ */
.call-upload { padding: 16px 18px; margin-bottom: 16px; }
.cu-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.cu-row + .cu-row { margin-top: 10px; }
.call-upload input[type=text], #call-title, #call-who { flex: 1; min-width: 180px; padding: 10px 13px; border: 1px solid var(--line); border-radius: 10px; font: inherit; font-size: 13.5px; background: var(--panel); color: var(--text); }
#call-title:focus, #call-who:focus { outline: none; border-color: rgba(201,162,39,.55); }
.cu-pick { background: rgba(60,50,35,.05); color: var(--muted); border: 1px solid var(--line); }
.cu-pick:hover { background: rgba(60,50,35,.09); color: var(--text); }
#call-progress { margin-top: 10px; font-size: 12.5px; }
.call-card { padding: 16px 18px; margin-bottom: 12px; }
.call-head { display: flex; align-items: center; gap: 10px; }
.call-head b { font-size: 14.5px; }
.call-head .kpi-state { margin-left: auto; }
.call-meta { font-size: 12px; color: var(--muted); margin: 4px 0 10px; }
.call-card audio { width: 100%; height: 34px; margin-bottom: 4px; }
.call-err { font-size: 12.5px; color: #a02f2f; background: rgba(214,86,86,.08); border: 1px solid rgba(214,86,86,.25); border-radius: 9px; padding: 7px 11px; margin: 8px 0; }
.call-busy { font-size: 12px; margin: 6px 0; }
.call-sum { margin-top: 10px; }
.call-sum b, .call-tasks b { font-size: 12px; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); }
.call-sum p { margin: 4px 0 0; font-size: 13.5px; line-height: 1.5; }
.call-tasks { margin-top: 10px; }
.call-tasks ul { margin: 5px 0 0; padding-left: 18px; }
.call-tasks li { font-size: 13.5px; line-height: 1.5; margin: 2px 0; }
.call-tr { margin-top: 10px; }
.call-tr summary { cursor: pointer; font-size: 12.5px; color: var(--muted); }
.call-tr-body { margin-top: 8px; font-size: 13px; line-height: 1.5; white-space: pre-wrap; max-height: 320px; overflow-y: auto; padding: 10px 12px; background: rgba(60,50,35,.03); border: 1px solid var(--line); border-radius: 10px; }
.call-acts { display: flex; gap: 8px; margin-top: 12px; }
.call-acts .ofc-btn { max-width: 140px; }

/* ═══ Касса офиса (Алекс 25.08) ═══ */
.kbal { padding: 18px 20px; margin-bottom: 14px; }
.kbal-main { font-size: 17px; margin-bottom: 14px; }
.kbal-main.ok { color: #4c8664; font-weight: 600; }
.kbal-who { font-weight: 700; }
.kbal-who.debt { color: #a02f2f; }
.kbal-owed { color: #a02f2f; font-size: 20px; }
.kbal-nums { display: flex; flex-wrap: wrap; gap: 22px; }
.kbal-num { display: flex; flex-direction: column; }
.kbal-num b { font-size: 20px; }
.kbal-num span { font-size: 11.5px; color: var(--muted); margin-top: 2px; }
.kbal-num.warn b { color: #a5801d; }
.kassa-add { flex-wrap: wrap; gap: 8px; align-items: center; }
.kassa-add input, .kassa-add select { padding: 9px 12px; border: 1px solid var(--line); border-radius: 10px; font: inherit; font-size: 13.5px; background: var(--panel); color: var(--text); }
.kassa-add #kd-client { flex: 1; min-width: 160px; }
.kassa-add #kd-note { flex: 1; min-width: 140px; }
.kassa-cols { display: grid; grid-template-columns: 1fr 300px; gap: 16px; align-items: start; }
@media (max-width: 900px) { .kassa-cols { grid-template-columns: 1fr; } }
.kdeal { padding: 14px 16px; margin-bottom: 10px; }
.kdeal.counted { border-left: 3px solid #5f9e77; }
.kd-top { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.kd-sum { font-size: 17px; }
.kd-client { font-size: 14px; }
.kd-recv { font-size: 11.5px; color: var(--muted); margin-left: auto; background: rgba(0,0,0,.04); border: 1px solid var(--line); border-radius: 99px; padding: 2px 9px; }
.kd-meta { font-size: 12px; color: var(--muted); margin: 5px 0 9px; }
.kd-conf { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; }
.kc { font-size: 12px; padding: 2px 10px; border-radius: 99px; border: 1px solid var(--line); color: var(--muted); }
.kc.on { color: #4c8664; border-color: rgba(95,158,119,.5); background: rgba(95,158,119,.1); }
.kc-status { font-size: 11.5px; color: var(--muted); margin-left: auto; }
.kc-status.ok { color: #4c8664; font-weight: 600; }
.kc-status.wait { color: #a5801d; }
.kd-acts { display: flex; gap: 8px; flex-wrap: wrap; }
.kd-acts .ofc-btn { max-width: 170px; }
.kassa-payout { flex-direction: column; align-items: stretch; gap: 8px; padding: 14px 16px !important; }
.kassa-payout select, .kassa-payout input { padding: 9px 12px; border: 1px solid var(--line); border-radius: 10px; font: inherit; font-size: 13px; background: var(--panel); color: var(--text); }
.kpay { font-size: 13px; padding: 7px 0; border-bottom: 1px solid var(--line); }
#kassa-payouts { margin: 14px 0; }
.kassa-log-wrap { padding: 12px 16px; }
.kassa-log-wrap summary { cursor: pointer; }
.kassa-log { margin-top: 10px; max-height: 300px; overflow-y: auto; }
.klog { font-size: 12px; padding: 4px 0; border-bottom: 1px solid var(--line); line-height: 1.4; }
/* финблок в Аналитике */
.fin-block { padding: 16px 20px; margin-bottom: 16px; }
.fin-head { display: flex; align-items: center; gap: 14px; margin-bottom: 12px; flex-wrap: wrap; }
.fin-head b { font-size: 15px; }
.fin-debt { color: #a02f2f; font-size: 13.5px; }
.fin-ok { color: #4c8664; font-size: 13.5px; font-weight: 600; }
.fin-nums { display: flex; flex-wrap: wrap; gap: 20px; }
.fin-nums .stat-num.warn b { color: #a5801d; }

/* Медиа → Аккаунты: витрина соцаккаунтов воронки (Алекс 26.08) */
.acc-bar { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; flex-wrap: wrap; }
.acc-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(244px, 1fr)); gap: 14px; }
.acc-card { background: var(--panel); border: 1px solid var(--line); border-radius: 14px; padding: 16px; display: flex; flex-direction: column; gap: 10px; }
.acc-top { display: flex; align-items: center; gap: 11px; }
.acc-ic { width: 38px; height: 38px; border-radius: 10px; flex: none; display: flex; align-items: center; justify-content: center; color: #fff; font-weight: 800; font-size: 13px; }
.acc-id { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.acc-id b { font-size: 14px; line-height: 1.2; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.acc-h { font-size: 12px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.acc-badge { font-size: 11px; font-weight: 700; padding: 3px 9px; border: 1px solid; border-radius: 20px; flex: none; }
.acc-plat { font-size: 12px; color: var(--muted); margin-top: -3px; }
.acc-stats { display: flex; gap: 6px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 10px 0; }
.acc-stat { flex: 1; display: flex; flex-direction: column; gap: 2px; text-align: center; }
.acc-stat b { font-size: 16px; color: var(--text); font-weight: 700; }
.acc-stat span { font-size: 10px; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; }
.acc-foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.acc-link { font-size: 12px; color: var(--blue); text-decoration: none; font-weight: 600; }
.acc-link:hover { text-decoration: underline; }
.acc-edit { background: rgba(60, 50, 35, .05); border: 1px solid var(--line); color: var(--muted); font-size: 12px; padding: 5px 11px; border-radius: 8px; cursor: pointer; }
.acc-edit:hover { color: var(--text); }
.acc-ov { position: fixed; inset: 0; background: rgba(40, 34, 26, .34); backdrop-filter: blur(2px); display: flex; align-items: center; justify-content: center; z-index: 100; }
.acc-modal { background: var(--panel); border: 1px solid var(--line); border-radius: 16px; padding: 22px; width: min(440px, 92vw); max-height: 90vh; overflow: auto; display: flex; flex-direction: column; gap: 11px; box-shadow: 0 20px 60px rgba(40, 34, 26, .25); }
.acc-modal h3 { font-size: 16px; margin: 0 0 4px; }
.acc-modal label { display: flex; flex-direction: column; gap: 4px; font-size: 12px; color: var(--muted); font-weight: 600; }
.acc-modal input, .acc-modal select { border: 1px solid var(--line); border-radius: 8px; padding: 8px 10px; font-size: 14px; color: var(--text); background: #fff; font-family: inherit; }
.acc-row3 { display: flex; gap: 8px; }
.acc-row3 label { flex: 1; min-width: 0; }
.acc-modal-acts { display: flex; align-items: center; gap: 8px; margin-top: 6px; }
.acc-save { background: var(--text); color: #fff; border: none; border-radius: 8px; padding: 9px 16px; font-size: 13px; font-weight: 600; cursor: pointer; }
.acc-del { background: none; border: 1px solid var(--line); color: var(--orange); border-radius: 8px; padding: 9px 14px; font-size: 13px; cursor: pointer; }
.acc-modal textarea { border: 1px solid var(--line); border-radius: 8px; padding: 8px 10px; font-size: 13.5px; line-height: 1.5; color: var(--text); background: #fff; font-family: inherit; resize: vertical; }
/* «создан» в угол + владелец + блок активности (Алекс 27.08) */
.acc-corner { display: flex; flex-direction: column; align-items: flex-end; gap: 5px; flex: none; }
.acc-created { font-size: 10px; color: var(--muted); white-space: nowrap; }
.acc-owner { font-size: 12.5px; color: var(--muted); margin-top: -2px; }
.acc-owner b { color: var(--text); }
.acc-act-empty { font-size: 12px; color: var(--muted); font-style: italic; }
.acc-act { border: 1px solid var(--line); border-left-width: 3px; border-radius: 10px; background: rgba(60, 50, 35, .02); }
.acc-act.lvl-low { border-left-color: #b5482f; }
.acc-act.lvl-mid { border-left-color: var(--orange); }
.acc-act.lvl-high { border-left-color: var(--green); }
.acc-act.lvl-none { border-left-color: var(--line); }
.acc-act-head { display: flex; align-items: center; gap: 8px; padding: 9px 11px; cursor: pointer; user-select: none; }
.acc-act-label { font-size: 10px; color: var(--muted); text-transform: uppercase; letter-spacing: .05em; }
.acc-act-badge { font-size: 12px; font-weight: 700; padding: 2px 10px; border: 1px solid var(--muted); border-radius: 20px; margin-left: auto; }
.acc-act-caret { color: var(--muted); font-size: 10px; transition: transform .15s; }
.acc-act.open .acc-act-caret { transform: rotate(180deg); }
.acc-act-plan { display: none; padding: 0 11px 11px; font-size: 12.5px; line-height: 1.55; color: var(--text); }
.acc-act.open .acc-act-plan { display: block; }

/* ═══════════════════════════════════════════════════════════════════════════
   МОБИЛЬНЫЙ TELEGRAM: страничная прокрутка + компактные сетки (Алекс 28.08)
   Стоит В КОНЦЕ ФАЙЛА намеренно: правила сеток должны быть НИЖЕ базовых
   определений (.prod-grid/.acc-grid и пр.), иначе те перебивают их по каскаду.
   Прокрутка: у пульта листается внутренняя вкладка, а не страница — на iOS в
   Telegram жест «тянуть вверх» перехватывается как «закрыть» вместо скролла.
   Лечим, разрешив прокрутку всей страницы (как обычный сайт). Всё под
   .in-telegram + max-width:760px: айпад(>760) и десктоп/КЦ НЕ затронуты.
   ═══════════════════════════════════════════════════════════════════════════ */
@media (max-width: 760px) {
  /* Карточки-плитки: крупные в 2 колонки, мелкие в 3 (иначе minmax даёт 1 колонку) */
  .projects, .prod-grid, .ag-arch-grid, .ag-agents, .tool-grid, .dept-grid,
  .lab-gallery, .kpi-grid, .acc-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 10px; }
  .folder-tiles, .body-gallery, .lib-grid { grid-template-columns: repeat(3, 1fr) !important; gap: 10px; }
  .prod-card { padding: 9px 10px; }
  .prod-foot .prod-act, .prod-chat-btn { font-size: 11px; padding: 7px 6px; }

  /* Список чатов — переносящиеся кнопки-чипы: тапаешь и выбираешь (Терминал и пр.),
     без свайпа и без вертикальной простыни (Алекс 28.08) */
  .chat-list { flex-direction: row !important; flex-wrap: wrap; gap: 6px; max-height: none !important; }
  .chat-item { width: auto !important; padding: 7px 12px; border: 1px solid var(--line); border-radius: 999px; }
}

/* Страничная прокрутка — ТОЛЬКО телефоны (.tg-phone ставит JS по экрану устройства:
   короткая сторона < 600pt). Айпад стартует узким поп-апом и по одной ширине окна
   неотличим от телефона — ему JS зовёт fullscreen → десктоп-раскладка (Алекс 28.08). */
@media (max-width: 540px) {
  html.in-telegram.tg-phone, html.in-telegram.tg-phone body { height: auto; min-height: 100%; overflow: visible; }
  html.in-telegram.tg-phone #app { height: auto; min-height: 100dvh; }
  html.in-telegram.tg-phone .layout { display: block; min-height: 0; }
  html.in-telegram.tg-phone .content { overflow: visible; height: auto; padding-bottom: 78px; }
  html.in-telegram.tg-phone .tab:not(.hidden) { overflow: visible; height: auto; min-height: 0; }
  /* нижняя навигация прибита к низу экрана, а не к низу вкладки */
  html.in-telegram.tg-phone .rail { position: fixed; left: 0; right: 0; bottom: 0; z-index: 50; }
  /* Чат — исключение: у него своя внутренняя лента, оставляем ей фикс-высоту */
  html.in-telegram.tg-phone .content:has(#tab-chat:not(.hidden)) { height: calc(100dvh - 56px); overflow: hidden; padding-bottom: 0; }
}

/* ── Чат на телефоне «как в Telegram» (Алекс 28.08): вся высота — ленте,
   чипы чатов одной прокручиваемой строкой, композер в одну строку с круглой ➤ ── */
@media (max-width: 540px) {
  /* заголовок «Гриффит · Главный мозг» прячем — чипы и так показывают, где ты */
  #tab-chat .head-row { display: none; }
  /* чипы чатов: одна строка, листается вбок пальцем (как папки в TG) */
  #tab-chat .chat-list { flex-wrap: nowrap !important; overflow-x: auto; padding: 6px 4px; }
  #tab-chat .chat-list::-webkit-scrollbar { display: none; }
  #tab-chat .chat-item { flex: none; white-space: nowrap; }
  #tab-chat .chat-body { gap: 8px; }
  /* пузыри как в TG: крупнее текст, «хвостик» у нижнего угла, свой — тёплый акцент */
  .chat-log { padding: 10px 9px; }
  .chat-log .msg { max-width: 86%; font-size: 15px; line-height: 1.45; padding: 9px 13px; border-radius: 18px; }
  .chat-log .msg.user { border-bottom-right-radius: 6px; background: rgba(201,162,39,.16); border-color: rgba(201,162,39,.25); }
  .chat-log .msg.assistant { border-bottom-left-radius: 6px; }
  .msg-meta .chip { font-size: 10px; }
  /* композер одной строкой: скрепка · поле (микро внутри) · круглая ➤; озвучка и звонок
     на телефоне спрятаны (доступны на айпаде/компе) — как в TG, ничего лишнего */
  #chat-tts, #chat-call { display: none; }
  #tab-chat .compose { flex-wrap: nowrap; gap: 7px; padding: 7px 8px; margin-bottom: 0; }
  #chat-send { font-size: 0; flex: none; width: 42px; height: 42px; border-radius: 50%; padding: 0; }
  #chat-send::after { content: '➤'; font-size: 16px; }
}

/* превью медиа-объектов в карточке апрува (Алекс 13.09): слайды карусели / рилс до публикации */
.media-gal { display: flex; gap: 8px; overflow-x: auto; padding: 4px 0 10px; margin-bottom: 8px; }
.media-gal img, .media-gal video { height: 260px; border-radius: 10px; flex: 0 0 auto; border: 1px solid rgba(0,0,0,.08); background: #fff; }

/* Рубильник авто-VPN (Алекс 14.09): выключить бота, поднимающего VPN, когда узел не нужен (лимиты/нет кода) */
.vpn-card { padding: 12px 18px; margin-bottom: 18px; }
.vpn-guard { margin: 10px 0 4px; }
.vpn-guard-row { display: flex; align-items: center; gap: 10px; font-size: 12.5px; color: var(--text); }
.vpn-guard-row .sw { position: relative; width: 40px; height: 22px; border-radius: 999px; background: var(--line); border: none; cursor: pointer; flex: 0 0 auto; transition: background .18s; padding: 0; }
.vpn-guard-row .sw::after { content: ''; position: absolute; top: 2px; left: 2px; width: 18px; height: 18px; border-radius: 50%; background: #fff; box-shadow: var(--shadow-sm); transition: left .18s; }
.vpn-guard-row .sw.on { background: var(--green); }
.vpn-guard-row .sw.on::after { left: 20px; }
.vpn-guard-hint { font-size: 11px; color: var(--muted); margin-top: 5px; line-height: 1.35; }

/* ═══ Дизайнерская (роль designer · Ариша): витрины лендингов + превью ═══ */
.rbtn[data-tab="design"] { --hc: #c8a34d; }   /* золото, как Офис */
.des-head { display: flex; align-items: baseline; gap: 12px; margin: 6px 0 16px; flex-wrap: wrap; }
.des-head h2 { font-size: 16px; font-weight: 700; }
/* витрины — компактная горизонтальная лента (все лендинги, листаются вбок), чтобы Превью было сразу под ними */
.des-gallery { display: flex; gap: 14px; overflow-x: auto; padding-bottom: 10px; scroll-snap-type: x proximity; }
.des-gallery::-webkit-scrollbar { height: 8px; }
.des-gallery::-webkit-scrollbar-thumb { background: var(--line); border-radius: 8px; }
.des-card { flex: 0 0 200px; scroll-snap-align: start; background: var(--panel); border: 1px solid var(--line); border-radius: 16px;
  overflow: hidden; box-shadow: var(--shadow); text-decoration: none; color: var(--text); transition: transform .18s, box-shadow .18s; }
.des-card:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(60,50,35,.1); }
.des-thumb { position: relative; height: 130px; background: linear-gradient(160deg, #f3ecdd, #e7dcc7);
  display: flex; align-items: center; justify-content: center; overflow: hidden; }
.des-thumb img { width: 100%; height: 100%; object-fit: cover; object-position: top; }
.des-noimg { font-size: 12px; color: var(--muted); }
.des-tag { position: absolute; top: 8px; left: 8px; font-size: 10px; font-weight: 600;
  background: rgba(255,255,255,.85); color: #5a5346; padding: 3px 8px; border-radius: 999px; }
.des-cap { padding: 11px 13px; }
.des-cap b { font-size: 13.5px; }
.des-preview { background: var(--panel); border: 1px solid var(--line); border-radius: 16px;
  box-shadow: var(--shadow); padding: 22px; min-height: 120px; }
/* у дизайнера верхняя панель проектного контекста не нужна */
.role-designer .proj-ctx { display: none !important; }

/* ═══ Вкладка «Ариша» — зеркало-наблюдатель для Алекса (read-only) ═══ */
.rbtn[data-tab="arisha"] { --hc: #a87fc0; }   /* лаванда */
.ar-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; margin: 4px 0 18px; }
.ar-head h2 { font-size: 17px; font-weight: 700; }
.ar-head h3 { font-size: 14px; font-weight: 700; margin-bottom: 12px; }
.ar-ro { font-size: 11px; font-weight: 600; color: #7a5a9c; background: rgba(168,127,192,.14);
  border: 1px solid rgba(168,127,192,.4); padding: 3px 9px; border-radius: 999px; margin-left: 8px; vertical-align: middle; }
.ar-refresh { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center;
  width: 38px; height: 38px; border-radius: 11px; border: 1px solid var(--line); line-height: 1; padding: 0;
  background: var(--panel); color: var(--muted); font-size: 18px; cursor: pointer; box-shadow: var(--shadow-sm); transition: color .18s, transform .3s; }
.ar-refresh:hover { color: var(--text); transform: rotate(180deg); }
.ar-split { display: grid; grid-template-columns: 1fr 380px; gap: 20px; align-items: start; }
.ar-left { min-width: 0; }
.ar-chat { background: rgba(255,255,255,.4); border: 1px solid var(--line); border-radius: 16px;
  display: flex; flex-direction: column; max-height: 72vh; overflow: hidden; }
.ar-chat-h { padding: 13px 16px; border-bottom: 1px solid var(--line); font-size: 13.5px; font-weight: 700; background: #faf7f0; }
.ar-log { flex: 1; overflow: auto; padding: 16px; display: flex; flex-direction: column; gap: 12px; }
.ar-msg { max-width: 88%; }
.ar-msg.user { align-self: flex-end; }
.ar-msg.bot { align-self: flex-start; }
.ar-who { font-size: 10.5px; color: var(--muted); margin: 0 4px 3px; }
.ar-msg.user .ar-who { text-align: right; }
.ar-txt { padding: 10px 14px; border-radius: 14px; font-size: 13.5px; line-height: 1.5; }
.ar-msg.user .ar-txt { background: rgba(255,255,255,.85); border: 1px solid var(--line); }
.ar-msg.bot .ar-txt { background: var(--panel); border: 1px solid var(--line); box-shadow: var(--shadow-sm); }
@media (max-width: 900px) { .ar-split { grid-template-columns: 1fr; } .ar-chat { max-height: 60vh; } }

/* ── Окно «Превью» (браузерная рамка) — общее для Дизайнерской и зеркала ── */
.des-preview { padding: 0; overflow: hidden; }
.pv-frame { border-radius: 16px; overflow: hidden; }
.pv-bar { display: flex; align-items: center; gap: 8px; padding: 10px 14px; border-bottom: 1px solid var(--line); background: #faf7f0; }
.pv-dot { width: 11px; height: 11px; border-radius: 50%; }
.pv-dot.r { background: #e0897a; } .pv-dot.y { background: #e6c162; } .pv-dot.g { background: #8fb98a; }
.pv-url { margin-left: 8px; font-size: 12px; color: var(--muted); background: #fff; border: 1px solid var(--line); border-radius: 8px; padding: 4px 12px; max-width: 70%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pv-body { min-height: 220px; padding: 24px; background: linear-gradient(160deg, #fbf7ef, #f0e9db); display: flex; align-items: center; justify-content: center; text-align: center; }
.pv-body iframe { width: 100%; height: 420px; border: 0; background: #fff; }

/* ── Примерка (dev try-on): кнопка входа на вкладке «Ариша» + плашка выхода сверху ── */
.ar-actions { display: flex; align-items: center; gap: 10px; flex: 0 0 auto; }
.ar-tryon { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 600; text-decoration: none;
  color: #7a5a9c; background: rgba(168,127,192,.14); border: 1px solid rgba(168,127,192,.4);
  padding: 8px 14px; border-radius: 999px; white-space: nowrap; transition: .18s; }
.ar-tryon:hover { background: rgba(168,127,192,.24); }
.devbar { position: fixed; top: 0; left: 0; right: 0; z-index: 200; display: flex; align-items: center; justify-content: center; gap: 16px;
  padding: 8px 16px; font-size: 12.5px; color: #5a3c1a; background: linear-gradient(90deg, #f4d58a, #e9c168);
  box-shadow: 0 2px 10px rgba(60,50,35,.2); }
.devbar a { color: #3a2a0c; font-weight: 700; text-decoration: underline; white-space: nowrap; }
body.has-devbar { padding-top: 34px; }
/* плашка примерки занимает 34px сверху → ужимаем #app, иначе низ (строка ввода) вылезает и режется */
body.has-devbar #app { height: calc(100vh - 34px); }
body.has-devbar .rail, body.has-devbar .topbar { margin-top: 0; }

/* ═══ Единый воркспейс дизайнера (Ариша): слева работа+витрины, справа живой чат ═══ */
#tab-design:not(.hidden), #tab-arisha:not(.hidden) { overflow: hidden; padding-bottom: 10px; }
/* .dw — flex-ребёнок таба (таб = flex-колонка): flex:1 заставляет заполнить высоту, а не расти по контенту */
.dw { flex: 1; min-height: 0; display: grid; grid-template-columns: minmax(0,1fr) minmax(320px, 380px); gap: 18px; }
.dw-left { min-width: 0; min-height: 0; overflow-y: auto; padding: 2px 4px 20px 2px; display: flex; flex-direction: column; gap: 22px; }
.dw-block { min-width: 0; }
.dw-h { display: flex; align-items: center; gap: 10px; font-size: 15px; font-weight: 700; margin-bottom: 12px; color: var(--text); }
.dw-hint { font-size: 11.5px; font-weight: 500; color: var(--muted); }
.dw-open { margin-left: auto; font-size: 12px; font-weight: 600; color: #b06a8a; text-decoration: none;
  background: rgba(200,120,150,.12); border: 1px solid rgba(200,120,150,.3); padding: 5px 12px; border-radius: 999px; }
.dw-open:hover { background: rgba(200,120,150,.2); }
/* превью: повыше и с внутренним скроллом лендинга */
.dw-preview { box-shadow: 0 6px 22px rgba(150,110,120,.1); border-radius: 18px; }
.dw-preview .pv-frame { border: 1px solid #efe4e0; }
.dw-preview .pv-body { padding: 0; min-height: 200px; }
.dw-preview .pv-body iframe { height: 62vh; min-height: 380px; }
.dw-preview .pv-body:not(:has(iframe)) { padding: 30px; min-height: 180px; }
/* карточка витрины — курсор-рука, лёгкая подпись «клик → превью» */
.des-card { cursor: pointer; }
.des-ext { position: absolute; top: 8px; right: 8px; width: 24px; height: 24px; border-radius: 8px; display: flex; align-items: center; justify-content: center;
  font-size: 13px; text-decoration: none; color: #6b3a4e; background: rgba(255,255,255,.85); border: 1px solid rgba(200,120,150,.3); opacity: 0; transition: opacity .15s; }
.des-card:hover .des-ext { opacity: 1; }
/* витрины компактнее в воркспейсе */
#tab-design .des-card, #tab-arisha .des-card { flex-basis: 180px; }

/* чат-колонка */
.dw-chat { display: flex; flex-direction: column; min-height: 0; background: linear-gradient(180deg, #fffdfb, #fdf6f4);
  border: 1px solid #f0e2de; border-radius: 20px; box-shadow: 0 6px 24px rgba(150,110,120,.1); overflow: hidden; }
.dw-chat-h { display: flex; align-items: center; gap: 11px; padding: 15px 18px; border-bottom: 1px solid #f2e6e2; background: rgba(255,255,255,.5); }
.dw-av { width: 34px; height: 34px; border-radius: 50%; background: linear-gradient(135deg, #e6b8c8, #c98aa6); color: #fff;
  display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 15px; box-shadow: var(--shadow-sm); }
.dw-chat-h b { font-size: 14.5px; }
.dw-st { font-size: 11.5px; color: var(--muted); }
.dw-log { flex: 1; min-height: 0; overflow-y: auto; padding: 18px; display: flex; flex-direction: column; gap: 14px; }
.dw-msg { max-width: 86%; }
.dw-msg.user { align-self: flex-end; }
.dw-msg.bot { align-self: flex-start; }
.dw-who { font-size: 10.5px; color: #b79aa2; margin: 0 6px 4px; }
.dw-msg.user .dw-who { text-align: right; }
.dw-txt { padding: 11px 15px; border-radius: 16px; font-size: 13.5px; line-height: 1.55; word-wrap: break-word; }
.dw-msg.user .dw-txt { background: linear-gradient(135deg, #f6dfe8, #efd0dd); color: #6b3a4e; border: 1px solid rgba(200,120,150,.2); border-bottom-right-radius: 5px; }
.dw-msg.bot .dw-txt { background: #fff; border: 1px solid #f0e2de; box-shadow: var(--shadow-sm); border-bottom-left-radius: 5px; }
.dw-msg.pending .dw-txt { color: var(--muted); }
.dw-dots { display: inline-block; animation: dwpulse 1.2s ease-in-out infinite; }
@keyframes dwpulse { 0%,100% { opacity: .4; } 50% { opacity: 1; } }
.dw-txt p { margin: 0 0 6px; } .dw-txt p:last-child { margin: 0; }
.dw-txt ul, .dw-txt ol { margin: 4px 0 4px 18px; } .dw-txt li { margin: 2px 0; }
/* поле ввода */
/* строка ввода — телеграм-стиль (эталон Феди 14.09): 📎 круг · пилюля · 🎤/↑ круг */
.dw-compose { display: flex; align-items: flex-end; gap: 8px; padding: 10px 12px 12px; border-top: 1px solid #f2e6e2; background: rgba(255,255,255,.55); flex-shrink: 0; }
.dw-round { flex: 0 0 auto; width: 44px; height: 44px; border-radius: 50%; border: none; cursor: pointer; display: inline-flex;
  align-items: center; justify-content: center; font-size: 19px; line-height: 1; padding: 0; transition: background .15s, transform .12s, box-shadow .15s; }
.dw-round.dw-primary { font-size: 22px; font-weight: 800; }
.dw-round svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 2.1; stroke-linecap: round; stroke-linejoin: round; display: block; }
.dw-round.dw-ghost { background: #f6e3ea; color: #c0537e; }
.dw-round.dw-ghost:hover { background: #f0d2de; color: #a03a63; }
.dw-round.dw-ghost.on { background: #e8607f; color: #fff; animation: dwpulse 1s infinite; }
.dw-round.dw-primary { background: linear-gradient(135deg, #e8607f, #c8506a); color: #fff; box-shadow: 0 4px 12px rgba(200,80,106,.35); }
.dw-round.dw-primary:hover { transform: translateY(-1px); box-shadow: 0 6px 16px rgba(200,80,106,.45); }
/* «пилюля» ввода */
.dw-pill { flex: 1; min-width: 0; display: flex; align-items: center; background: #fff; border: 1px solid #ecdcd8;
  border-radius: 22px; padding: 4px 16px; transition: border-color .15s, box-shadow .15s; }
.dw-pill:focus-within { border-color: #e2b8c8; box-shadow: 0 0 0 3px rgba(226,184,200,.25); }
.dw-pill textarea, .dw-pill textarea:focus {
  flex: 1; width: 100%; height: 26px; min-height: 26px; max-height: 120px; padding: 4px 0; margin: 0;
  border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important;
  outline: none; resize: none; -webkit-appearance: none; appearance: none; display: block;
  font: inherit; font-size: 14.5px; line-height: 1.4; color: var(--text); overflow-y: auto; transition: none; }
.dw-pill textarea::placeholder { color: #b7a6ac; }
.dw-pill textarea::-webkit-scrollbar { width: 0; height: 0; }
.dw-pill textarea { scrollbar-width: none; }
.dw-pill textarea::placeholder { color: #b7a6ac; }
.dw-tool { flex: 0 0 auto; width: 38px; height: 38px; border-radius: 12px; border: 1px solid #ecdcd8; background: #fff;
  cursor: pointer; font-size: 16px; line-height: 1; transition: .15s; display: inline-flex; align-items: center; justify-content: center; }
.dw-tool:hover { background: #fbeef2; border-color: #e2b8c8; }
.dw-tool.on { background: #e8607f; color: #fff; border-color: #e8607f; animation: dwpulse 1s infinite; }
/* чипы прикреплённых файлов */
.dw-atts { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 12px; }
.dw-atts:empty { display: none; }
.dw-att { display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; color: #6b3a4e; background: #fbeef2;
  border: 1px solid rgba(200,120,150,.3); border-radius: 999px; padding: 3px 6px 3px 8px; max-width: 180px; }
.dw-att img { width: 20px; height: 20px; border-radius: 5px; object-fit: cover; }
.dw-att button { border: none; background: none; color: #b06a8a; cursor: pointer; font-size: 15px; line-height: 1; padding: 0 2px; }
.dw-att-mini { font-size: 11px; opacity: .75; margin-top: 5px; }
/* список блоков лендинга (поблочная правка) */
.dw-blocks:empty { display: none; }
.dw-blocks { margin-top: 12px; }
.dw-blocks-h { font-size: 13px; font-weight: 700; margin-bottom: 8px; display: flex; align-items: baseline; gap: 8px; }
.dw-blocks-row { display: flex; flex-wrap: wrap; gap: 8px; }
.dw-block-chip { font-size: 12.5px; font-weight: 600; color: #6b3a4e; background: #fff; border: 1px solid #eccdd8;
  border-radius: 999px; padding: 7px 14px; cursor: pointer; transition: .15s; }
.dw-block-chip:hover { background: #fbeef2; border-color: #e2b8c8; }
.dw-block-chip.active { background: linear-gradient(135deg, #e8607f, #c8506a); color: #fff; border-color: #e8607f; }
/* фокус-чип над полем ввода */
.dw-focus { margin: 0 12px 2px; padding: 7px 12px; font-size: 12.5px; color: #6b3a4e; background: #fbeef2;
  border: 1px solid rgba(200,120,150,.35); border-radius: 12px; display: flex; align-items: center; gap: 8px; }
.dw-focus button { margin-left: auto; border: none; background: none; color: #b06a8a; font-size: 16px; cursor: pointer; line-height: 1; }
/* зеркало (только чтение): прячем поле ввода, если бы было */
.dw-mirror .dw-compose { display: none; }
/* адаптив: узко — колонки в стопку */
@media (max-width: 1000px) { .dw { grid-template-columns: 1fr; grid-template-rows: auto 1fr; } .dw-chat { max-height: 60vh; } }

/* ── КОМАНДА: контуры общего репо agency (вкладка «Команда») ─────────────── */
.team-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 14px; }
.team-card { padding: 14px; display: flex; flex-direction: column; gap: 6px; }
.team-card-head { display: flex; align-items: center; gap: 8px; font-size: 15px; margin-bottom: 4px; }
.team-card-head .muted { margin-left: auto; font-size: 12px; }
.team-file { display: flex; align-items: center; gap: 8px; width: 100%; text-align: left; padding: 7px 10px;
  border: 1px solid rgba(255,255,255,.07); border-radius: 8px; background: rgba(255,255,255,.03);
  color: var(--text); cursor: pointer; font: inherit; font-size: 13px; }
.team-file:hover { background: rgba(255,255,255,.07); }
.team-file-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.team-file .muted { margin-left: auto; flex: none; font-size: 11px; }
#team-modal .ag-modal-card { width: min(760px, 94vw); }
/* телефоны: карточки в одну колонку (страничная схема .tg-phone не трогается) */
@media (max-width: 600px) { .team-grid { grid-template-columns: 1fr; } }

/* ── team-runs (14.09): карточки чужих узлов + полоса распределённых запусков ── */
.ofc-card.foreign { opacity: .85; border-style: dashed; cursor: default; }
.occ-node { margin-left: auto; font-size: 10px; padding: 1px 7px; border-radius: 9px;
  border: 1px solid var(--blue, #5b8db8); color: var(--blue, #5b8db8); white-space: nowrap; flex-shrink: 0; }
.team-runs { display: flex; flex-wrap: wrap; gap: 8px 14px; padding: 9px 14px; margin: 0 0 12px;
  border-radius: 14px; font-size: 12.5px; align-items: center; }
.team-runs .trun { display: inline-flex; gap: 5px; align-items: center; white-space: nowrap; }
.team-runs .trun.their b { color: var(--orange, #c98a3d); }
.team-runs .trun.mine b { color: var(--green, #6a9955); }

/* ── модалка офиса (Фёдор, #14): страница под ней не листается ── */
body.modal-lock { overflow: hidden; }
.ofc-modal-card { overscroll-behavior: contain; }

/* ── Команда (Фёдор 14.09): подпапки, лендинги/картинки «↗», кнопка «ещё» ── */
.team-file-dir { opacity: .55; font-size: 11px; }
.team-file.view .team-file-name::before { content: '🌐 '; font-size: 11px; }
.team-more-btn { align-self: flex-start; margin-top: 2px; padding: 4px 10px; font-size: 12px; border-radius: 9px;
  border: 1px solid rgba(255,255,255,.14); background: transparent; color: inherit; cursor: pointer; opacity: .8; }
.team-more-btn:hover { opacity: 1; background: rgba(255,255,255,.07); }

/* ── Режим проекта (Федя 21.09): клик по карточке проекта → в рейле только его разделы ── */
.rbtn[data-scope="ws"], .rail-ws { display: none; }
body.ws-mode .rbtn[data-scope="ws"] { display: flex; }
body.ws-mode .rail-ws { display: block; }
body.ws-mode .rbtn[data-scope="global"] { display: none !important; }
.rail-ws { font-size: 10px; font-weight: 700; letter-spacing: .08em; color: var(--muted); text-align: center; padding: 2px 0 6px; }
.rbtn.ws-back { color: var(--muted); height: 52px; margin-top: 2px; }
.rbtn.ws-back svg { width: 18px; height: 18px; }
.rbtn.ws-back span { font-size: 10px; }
@media (max-width: 760px) { .rail-ws { display: none !important; } }
/* карточка проекта-логотипа: логотип на весь прямоугольник, клик — внутрь */
.pj.pj-logo { padding: 0; overflow: hidden; cursor: pointer; width: 200px; height: 200px; background: #fff; display: block; }
.pj.pj-logo img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .25s ease; }
.pj.pj-logo:hover img { transform: scale(1.03); }
.pj.pj-logo:before { display: none; }
/* окно скаута по картам */
.kpi-card.kpi-open { cursor: pointer; }
.kpi-card.kpi-open:hover { border-color: var(--cyan); }
.scout-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 18px; align-items: start; }
@media (max-width: 1000px) { .scout-grid { grid-template-columns: 1fr; } }
.scout-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.scout-table th, .scout-table td { text-align: left; padding: 6px 8px; border-bottom: 1px solid var(--line); vertical-align: top; }
.scout-table th { font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); font-weight: 600; }
.scout-now { background: rgba(60,50,35,.04); border-radius: 12px; padding: 12px 14px; margin-bottom: 12px; font-size: 13.5px; }
.scout-niches { display: flex; gap: 6px; flex-wrap: wrap; margin: 8px 0; }
.scout-n { font-size: 12px; padding: 3px 9px; border-radius: 999px; background: #fff; border: 1px solid var(--line); color: var(--muted); }
.scout-n.run { border-color: var(--cyan); color: var(--cyan); } .scout-n.ok { border-color: var(--green); color: #4f7a49; }
.scout-steps { font-family: var(--mono); font-size: 12px; line-height: 1.6; max-height: 360px; overflow: auto; background: #fff; border: 1px solid var(--line); border-radius: 10px; padding: 8px 10px; margin: 8px 0; }
.scout-sub { font-size: 11.5px; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); margin: 12px 0 6px; font-weight: 600; }
.scout-lead { font-size: 13px; padding: 4px 0; border-bottom: 1px dashed var(--line); }
.scout-hist { font-size: 13px; margin-bottom: 6px; } .scout-hist summary { cursor: pointer; }
/* Дизайнерская: лендинги клиентов — правки */
.dwc { border: 1px solid var(--line); border-radius: 14px; background: #fff; margin-bottom: 8px; overflow: hidden; }
.dwc.dropping { outline: 2px dashed var(--cyan); outline-offset: -4px; }
.dwc-h { display: flex; gap: 10px; align-items: center; padding: 10px 14px; cursor: pointer; font-size: 14px; flex-wrap: wrap; }
.dwc-h:hover { background: rgba(60,50,35,.03); }
.dwc-tag { font-size: 11px; padding: 2px 8px; border-radius: 999px; background: rgba(60,50,35,.06); color: var(--muted); }
.dwc-open { font-size: 13px; color: var(--cyan); text-decoration: none; }
.dwc-arrow { margin-left: auto; color: var(--muted); }
.dwc-body { padding: 0 14px 14px; }
.dwc-prev { width: 100%; height: 420px; border: 1px solid var(--line); border-radius: 12px; background: #fff; margin-bottom: 10px; }
.dwc-note { width: 100%; min-height: 96px; font: 14px/1.5 var(--sans); padding: 10px 12px; border: 1px solid var(--line); border-radius: 11px; resize: vertical; }
.dwc-shots { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 8px; margin: 10px 0; }
.dwc-shots figure { position: relative; margin: 0; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; }
.dwc-shots img { display: block; width: 100%; height: 100px; object-fit: cover; }
.dwc-x { position: absolute; top: 4px; right: 6px; background: rgba(255,255,255,.9); border-radius: 999px; padding: 1px 7px; font-size: 12px; cursor: pointer; color: var(--muted); }
.dwc-acts { display: flex; gap: 8px; align-items: center; margin-top: 6px; }
.dwc-btn { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border-radius: 11px; border: 1px solid var(--line); background: #fff; font-size: 13.5px; font-weight: 600; cursor: pointer; color: var(--text); }
.dwc-btn.pri { background: var(--cyan); border-color: var(--cyan); color: #fff; }
.dwc-st { font-size: 12.5px; margin-top: 6px; }

/* ── Уведомления (Федя 27.09, notify-and-schema): колокольчик + список — lib/notify.js ── */
.tb-bell { position: relative; margin-left: auto; width: 38px; height: 38px; border: none; background: transparent;
  border-radius: 12px; cursor: pointer; font-size: 18px; display: inline-flex; align-items: center; justify-content: center; }
.tb-bell:hover { background: rgba(60, 50, 35, .06); }
.tb-bell-count { position: absolute; top: 2px; right: 2px; min-width: 16px; height: 16px; padding: 0 4px;
  border-radius: 999px; background: var(--orange); color: #fff; font-size: 10px; font-weight: 700;
  line-height: 16px; text-align: center; }
.notif-panel { position: fixed; top: 56px; right: 20px; width: 360px; max-width: calc(100vw - 32px); max-height: 70vh; overflow: auto;
  background: var(--panel); border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--shadow); z-index: 400; padding: 8px; }
/* панель вынесена в <body> (app.js) — иначе слой шапки держал её под строкой ввода чата (Федя 28.09) */
.notif-panel h4 { font-size: 13px; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); padding: 6px 8px; margin: 0; }
.notif-item { padding: 9px 10px; border-radius: 10px; font-size: 13px; line-height: 1.4; cursor: pointer; }
.notif-item + .notif-item { margin-top: 2px; }
.notif-item:hover { background: rgba(60, 50, 35, .05); }
.notif-item.unseen { background: rgba(179, 144, 58, .08); font-weight: 600; }
.notif-item.bad { border-left: 3px solid #c0604f; padding-left: 8px; }
.notif-item.warn { border-left: 3px solid var(--cyan); padding-left: 8px; }
.notif-item time { display: block; font-size: 11px; color: var(--muted); font-weight: 400; margin-top: 2px; }
.notif-empty { padding: 16px 8px; color: var(--muted); font-size: 13px; text-align: center; }
.notif-mark-all { display: block; width: 100%; margin-top: 6px; padding: 7px; border: 1px solid var(--line); border-radius: 9px;
  background: #fff; font: inherit; font-size: 12.5px; color: var(--muted); cursor: pointer; }
.notif-mark-all:hover { color: var(--text); border-color: var(--cyan); }
.team-banner { background: #f6efdd; border-bottom: 1px solid var(--line); padding: 8px 26px; font-size: 13px; color: #8a6a1a;
  display: flex; gap: 16px; flex-wrap: wrap; align-items: center; }
.team-banner b { font-weight: 700; }
/* Автообновление узла (Федя 29.09, pult-self-update): кнопка «Обновить сейчас» в той же строке плашки */
.team-banner-btn { padding: 4px 12px; font-size: 12.5px; border-radius: 8px; }
.team-banner-btn:disabled { opacity: .6; cursor: default; }

/* ── кнопка «Обновить» в шапках вкладок: квадрат, иконка по центру (была строчная ↻, криво) ── */
button.ghost[title="Обновить"] { width: 38px; height: 38px; padding: 0; display: inline-flex; align-items: center;
  justify-content: center; align-self: center; border-radius: 12px; line-height: 1; flex: none; }
button.ghost[title="Обновить"] svg { display: block; }
button.ghost[title="Обновить"]:active svg { transform: rotate(90deg); transition: transform .15s; }

/* ── «Контуры» (Федя/Ариша 29.09): обзор-карточки контуров + страница контура ──────────────── */
.ctr-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 14px; }
.ctr-card { position: relative; padding: 16px 18px; border-radius: 16px; cursor: pointer; overflow: hidden; }
.ctr-card::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--ctr-color, var(--muted)); }
.ctr-card-head { display: flex; align-items: baseline; gap: 8px; }
.ctr-card-head b { font-size: 15.5px; }
.ctr-owners { font-size: 11.5px; color: var(--muted); margin-left: auto; }
.ctr-desc { font-size: 12.5px; margin: 6px 0 10px; line-height: 1.4; }
.ctr-agents { display: flex; gap: 5px; align-items: center; margin-bottom: 10px; flex-wrap: wrap; }
.ctr-adot { width: 8px; height: 8px; border-radius: 50%; background: var(--muted); flex: none; }
.ctr-adot.on { background: #5f9e77; }
.ctr-adot.wait { background: #d8a527; }
.ctr-adot.off { background: #b9b1a1; }
.ctr-counts { display: flex; gap: 14px; font-size: 12px; color: var(--muted); margin-bottom: 10px; flex-wrap: wrap; }
.ctr-counts b { color: var(--text); font-size: 13.5px; }
.ctr-events { border-top: 1px solid var(--line); padding-top: 8px; display: flex; flex-direction: column; gap: 4px; }
.ctr-ev { font-size: 12px; line-height: 1.4; }
.ctr-ev-t { color: var(--muted); margin-right: 6px; font-variant-numeric: tabular-nums; }
.ctr-empty { font-size: 12.5px; }

/* страница контура */
.ctr-one-head { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; margin-bottom: 4px; }
.ctr-one-head b { font-size: 18px; border-left: 4px solid var(--ctr-color, var(--muted)); padding-left: 10px; }
.ctr-one .ctr-desc { margin: 4px 0 14px; }
.ctr-one .ofc-tabs { margin-bottom: 16px; }
.ctr-h3 { font-size: 13px; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); margin: 16px 0 8px; }
.ctr-h3:first-child { margin-top: 0; }

.ctr-proj-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 9px 4px; border-bottom: 1px solid var(--line); font-size: 13px; }
.ctr-proj-row:last-child { border-bottom: none; }
.ctr-proj-id { font-family: var(--mono); font-size: 11px; color: var(--muted); flex: none; }
.ctr-proj-row a { color: var(--text); font-weight: 600; text-decoration: none; border-bottom: 1px solid var(--line); }
.ctr-proj-row a:hover { border-color: var(--cyan); }
.ctr-stage { margin-left: auto; font-size: 11px; padding: 2px 9px; border-radius: 99px; background: rgba(128,128,128,.12); color: var(--muted); }
.ctr-also { font-size: 11px; color: var(--orange); }
.ctr-devlink { font-size: 12px; }

.ctr-agents-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 12px; }
.ctr-agent { padding: 14px 16px; border-radius: 14px; }

.ctr-journal-tools { margin-bottom: 10px; }
.ctr-journal-tools select { padding: 6px 10px; border-radius: 9px; border: 1px solid var(--line); background: #fff; font: inherit; font-size: 12.5px; }
.ctr-retro .ctr-journal-tools { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.ctr-retro .ctr-proj-row { align-items: flex-start; }
.ctr-ev-row { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; padding: 7px 4px; border-bottom: 1px solid var(--line); }
.ctr-ev-row:last-child { border-bottom: none; }
.ctr-kind { font-size: 10px; text-transform: uppercase; letter-spacing: .03em; padding: 2px 8px; border-radius: 99px; background: rgba(128,128,128,.12); color: var(--muted); flex: none; }
.ctr-ev-txt { flex: 1 1 260px; font-size: 12.5px; }
.ctr-ref a { color: inherit; }
.ctr-who { font-size: 11px; }
#ctr-jmore { margin-top: 10px; }

.ctr-pre { white-space: pre-wrap; word-break: break-word; font-family: var(--sans); font-size: 13px; line-height: 1.6;
  background: rgba(255,255,255,.5); border: 1px solid var(--line); border-radius: 12px; padding: 14px 16px; }
.ctr-rj { margin-top: 12px; }
.ctr-rj summary { cursor: pointer; font-size: 12.5px; color: var(--muted); margin-bottom: 8px; }

.ctr-metrics { display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 12px; }
.ctr-metric { background: rgba(255,255,255,.5); border: 1px solid var(--line); border-radius: 14px; padding: 14px; text-align: center; }
.ctr-metric b { display: block; font-size: 20px; }
.ctr-metric span { font-size: 11.5px; color: var(--muted); }

@media (max-width: 640px) {
  .ctr-grid, .ctr-agents-grid, .ctr-metrics { grid-template-columns: 1fr; }
  .ctr-owners { margin-left: 0; }
}

/* ── «Цех» и «Запросы на дизайн» (волна 5, ночная сборка 30.09) ─────────────────────────────── */
.ts-kill { padding: 9px 16px; border: none; border-radius: 12px; background: #c0392b; color: #fff; font-weight: 700; cursor: pointer; }
.ts-kill.on { background: #2e7d4f; }
.ts-alarm { background: #c0392b; color: #fff; font-weight: 700; padding: 10px 14px; border-radius: 12px; margin-bottom: 12px; }
.ts-total { margin-bottom: 12px; font-size: 12.5px; }
.ts-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 14px; margin-bottom: 14px; }
.ts-lane { padding: 14px 16px; border-radius: 16px; }
.ts-lane.blocked { border-color: #c0392b; }
.ts-lane-h { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; margin-bottom: 8px; }
.ts-lane-h b { font-size: 15px; }
.ts-lane-h .muted { font-size: 11.5px; flex: 1 1 100%; order: 3; }
.ts-pause { margin-left: auto; padding: 4px 10px; font-size: 12px; }
.ts-blocked { font-size: 12px; color: #c0392b; margin-bottom: 6px; }
.ts-sec { border-top: 1px solid var(--line); padding: 7px 0; display: flex; flex-direction: column; gap: 4px; font-size: 12.5px; }
.ts-lbl { font-size: 10.5px; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); }
.ts-lbl.bad, .bad { color: #c0392b; }
.ts-run { cursor: pointer; padding: 6px 8px; border-radius: 9px; background: rgba(128,128,128,.07); display: flex; flex-direction: column; gap: 2px; }
.ts-run:hover, .ts-run.on { background: rgba(179,144,58,.16); }
.ts-step { font-size: 11.5px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ts-q { font-size: 12.5px; }
.ts-err { font-size: 12px; color: #c0392b; }
.ts-usage { padding-top: 6px; border-top: 1px solid var(--line); font-size: 11.5px; display: flex; flex-direction: column; gap: 4px; }
.ts-bar { height: 5px; border-radius: 99px; background: rgba(128,128,128,.18); overflow: hidden; }
.ts-bar i { display: block; height: 100%; background: #5f9e77; }
.ts-bar i.bad { background: #c0392b; }
.ts-log, .ts-feed, .ts-rules-wrap { padding: 14px 16px; border-radius: 16px; margin-bottom: 14px; }
.ts-log-h { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.ts-log-h .ts-close { margin-left: auto; }
.ts-pre { background: #1e1b17; color: #e8e2d4; font: 12px/1.5 var(--mono); padding: 12px; border-radius: 10px; max-height: 280px; overflow: auto; white-space: pre-wrap; margin: 0 0 10px; }
.ts-pin { font-size: 12.5px; display: flex; flex-direction: column; gap: 6px; }
.ts-pinrow { padding: 6px 8px; background: rgba(179,144,58,.12); border-radius: 8px; }
.ts-pinadd { display: flex; gap: 8px; }
.ts-pinadd input { flex: 1; padding: 8px 10px; border-radius: 9px; border: 1px solid var(--line); font: inherit; background: #fff; }
.ts-feed-h { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; flex-wrap: wrap; }
.ts-feed-h .ofc-tab { padding: 4px 14px; font-size: 12px; }
.ts-feed-h .ofc-tab.on { background: var(--cyan); color: #fff; border-color: var(--cyan); }
.ts-rules textarea { width: 100%; box-sizing: border-box; font: 12.5px/1.5 var(--mono); padding: 10px; border-radius: 10px; border: 1px solid var(--line); background: #fff; }
.dr-card { padding: 14px 16px; border-radius: 16px; margin-bottom: 12px; }
.dr-card.dr-over { border-color: #c0392b; }
.dr-head { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; cursor: pointer; }
.dr-st { font-size: 11px; padding: 2px 10px; border-radius: 99px; background: rgba(128,128,128,.14); color: var(--muted); }
.dr-st-taken { background: rgba(130,152,172,.25); } .dr-st-question { background: rgba(216,165,39,.25); }
.dr-st-done_by_designer { background: rgba(179,144,58,.25); } .dr-st-done { background: rgba(95,158,119,.25); }
.dr-due { font-size: 12px; color: var(--muted); margin-left: auto; }
.dr-q { margin-top: 8px; padding: 8px 10px; border-radius: 9px; background: rgba(216,165,39,.16); font-size: 12.5px; }
.dr-body { margin-top: 10px; display: flex; flex-direction: column; gap: 8px; }
.dr-brief { white-space: pre-wrap; font-size: 13.5px; line-height: 1.5; }
.dr-files { font-size: 12.5px; }
.dr-actions, .dr-upload { display: flex; gap: 8px; flex-wrap: wrap; }
.dr-file { padding: 7px 12px; border-radius: 10px; cursor: pointer; font-size: 12.5px; }
/* Макет дизайн-запроса (30.09): просмотрщик в карточке — панель, превью 1440/390, код, версии */
.mk-line { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.mk-line .mk-toggle { padding: 5px 12px; font-size: 12.5px; border-radius: 9px; }
.mk-mini { padding: 2px 8px; font-size: 11.5px; border-radius: 7px; vertical-align: baseline; }
.mk { margin-top: 4px; border: 1px solid var(--line); border-radius: 14px; overflow: hidden; background: #fff; }
.mk-bar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 8px 10px; border-bottom: 1px solid var(--line); background: rgba(60,50,35,.03); }
.mk-seg { display: inline-flex; border: 1px solid var(--line); border-radius: 9px; overflow: hidden; }
.mk-seg-b { background: none; color: var(--muted); padding: 5px 12px; font-size: 12.5px; border-radius: 0; font-weight: 500; }
.mk-seg-b:hover { transform: none; box-shadow: none; color: var(--text); }
.mk-seg-b.on { background: var(--cyan); color: #fff; }
.mk-bar .mk-save { padding: 6px 16px; font-size: 12.5px; border-radius: 9px; }
.mk-bar .mk-save:disabled { opacity: .45; cursor: default; transform: none; box-shadow: none; }
.mk-bar .dr-file { padding: 5px 10px; font-size: 12px; }
.mk-bar > button.ghost { padding: 5px 12px; font-size: 12.5px; border-radius: 9px; }
.mk-newtab { display: inline-block; padding: 5px 12px; font-size: 12.5px; border-radius: 9px; background: rgba(60,50,35,.05); color: var(--muted); text-decoration: none; }
.mk-newtab:hover { color: var(--text); background: rgba(60,50,35,.09); }
.mk-hint { padding: 6px 12px; font-size: 12px; border-bottom: 1px solid var(--line); }
.mk-versions { padding: 8px 12px; border-bottom: 1px solid var(--line); font-size: 12.5px; display: flex; flex-direction: column; gap: 4px; max-height: 180px; overflow: auto; }
.mk-ver.cur { font-weight: 500; }
.mk-stage { position: relative; width: 100%; height: 72vh; min-height: 420px; overflow: hidden; background: #e9e6e0; }
.mk-stage.hidden { display: none; }
.mk-frame { border: 0; background: #fff; transform-origin: 0 0; display: block; }
.mk-stage[data-w="390"] { overflow: auto; }
.mk-code { width: 100%; box-sizing: border-box; height: 72vh; min-height: 420px; border: 0; border-radius: 0; padding: 12px 14px; font: 12.5px/1.5 var(--mono); background: #fff; resize: vertical; }

/* ── Запросы на дизайн: компактные карточки (ночная сборка 30.09, вечер) ──
   Свёрнутая: превью 1440→миниатюра (тот же iframe, что .dwc-prev), чипы, одна строка брифа.
   Раскрытая — на всю ширину сетки, с макетом 1440/390 внутри. */
.dr-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 12px; align-items: start; }
.dr-grid .dr-card { margin-bottom: 0; min-width: 0; }
.dr-card.open { grid-column: 1 / -1; }
.dr-head { display: flex; align-items: flex-start; gap: 12px; flex-wrap: nowrap; }
.dr-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 5px; }
.dr-t { display: flex; align-items: center; gap: 8px; min-width: 0; }
.dr-t b { font-size: 14.5px; line-height: 1.3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.dr-t .dwc-arrow { margin-left: auto; flex: none; }
.dr-meta { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-size: 11.5px; }
.dr-meta .ctr-proj-id { font-size: 11px; }
.dr-one { font-size: 12.5px; line-height: 1.4; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dr-chip { display: inline-flex; align-items: center; font-size: 11px; line-height: 1.5; padding: 0 8px; border-radius: 99px; border: 1px solid var(--line); background: rgba(60,50,35,.04); color: var(--muted); text-decoration: none; white-space: nowrap; max-width: 100%; }
.dr-chip a { color: inherit; text-decoration: none; }
a.dr-lnk:hover, .dr-src:hover { color: var(--cyan); border-color: var(--cyan); }
.dr-head .dr-due { margin-left: 0; font-size: 11.5px; }
.dr-due.bad { color: #c0392b; font-weight: 600; }
.dr-thumb { flex: none; width: 132px; height: 84px; border-radius: 10px; overflow: hidden; border: 1px solid var(--line); background: #fff; position: relative; }
.dr-thumb iframe { width: 1440px; height: 916px; border: 0; transform: scale(.0917); transform-origin: 0 0; pointer-events: none; background: #fff; }
.dr-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.dr-thumb-empty { display: flex; align-items: center; justify-content: center; background: rgba(179,144,58,.08); color: var(--cyan); font-size: 26px; font-weight: 700; }
.dr-pics { display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: 8px; }
.dr-pics a { display: block; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; background: #fff; }
.dr-pics img { display: block; width: 100%; height: 84px; object-fit: cover; }
.dr-card.open .dr-head { padding-bottom: 2px; }
.dr-card.open .dr-thumb { width: 88px; height: 56px; }
.dr-card.open .dr-thumb iframe { transform: scale(.0611); height: 916px; }
@media (max-width: 720px) {
  .dr-grid { grid-template-columns: minmax(0, 1fr); }
  .dr-thumb { width: 96px; height: 64px; }
  .dr-thumb iframe { transform: scale(.0667); height: 960px; }
  .dr-card.open .dr-thumb { width: 72px; height: 48px; }
  .dr-card.open .dr-thumb iframe { transform: scale(.05); height: 960px; }
  .dr-t b { white-space: normal; }
  .mk-stage { height: 60vh; min-height: 360px; }
}
.dr-card.open .mk-stage { height: clamp(360px, 58vh, 620px); }