:root{ --bg:#0f1115; --card:#171a21; --card2:#1e222b; --line:#262b36; --fg:#e8ecf2; --dim:#8b93a3; --accent:#3b9dff; --ok:#3ddc84; --warn:#ffb454; --bad:#ff5d5d; --q:#c78bff; --draft:#63b3ff; --shell:#6b7280; --quota-100:var(--fg); --radius:14px; --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; --term-fs:11px; /* база терминала; на десктопе крупнее — см. медиа */ /* Безопасные поля. В обычном окне их даёт браузер (env), в полноэкранном Mini App — сам Telegram: сверху ложатся его кнопки «свернуть/закрыть», и под ними нельзя рисовать. Значения обновляет JS по contentSafeArea. */ --sa-top:env(safe-area-inset-top); --sa-bottom:env(safe-area-inset-bottom); /* Полоса контента: одна ширина и один боковой отступ для шапки и карточек. */ --page:780px; --pagepad:12px; --nav-h:56px; } /* Native layout standalone APK уже отодвигает весь WebView от status bar, выреза и navigation bar через WindowInsets. Повторный CSS safe-area давал двойной верхний отступ; Telegram продолжает использовать env/свои inset. */ html.android-app{--sa-top:0px;--sa-bottom:0px} body.light{ --bg:#f2f4f7; --card:#ffffff; --card2:#eef1f6; --line:#dfe4ec; --fg:#111827; --dim:#6b7280; --quota-100:#000000; } *{box-sizing:border-box;-webkit-tap-highlight-color:transparent} html,body{margin:0;padding:0;height:100%} body{ background:var(--bg); color:var(--fg); font:15px/1.45 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif; padding-bottom:0; overscroll-behavior-y:none; } a{color:var(--accent)} /* Ширина полосы контента одна на шапку и карточки: раньше на широком экране (фулскрин Telegram Desktop) .wrap растягивался до 1500, а header оставался на 1180 — заголовок и «live» уезжали от края карточек. */ .wrap{max-width:var(--page);margin:0 auto;padding:10px var(--pagepad) 0} /* высота нижней панели + запас: последняя карточка не должна прятаться под ней */ .navspacer{height:calc(84px + var(--sa-bottom));flex:none} .hidden{display:none!important} /* Pull-to-refresh свой, а не браузерный: Telegram WebView кэширует обычный reload, а его системный вертикальный свайп закрывает Mini App. */ #pull-refresh{ position:fixed;left:50%;top:calc(8px + var(--sa-top));z-index:65; min-width:156px;padding:7px 12px;border:1px solid var(--line);border-radius:18px; background:var(--card2);color:var(--dim);box-shadow:0 6px 22px #0005; display:flex;align-items:center;justify-content:center;gap:7px; font-size:12px;line-height:1;pointer-events:none;opacity:0; transform:translate(-50%,-48px);transition:transform .16s ease,opacity .16s ease; overflow:hidden; } #pull-refresh.show{opacity:1;transform:translate(-50%,var(--pull-y,0px))} #pull-refresh.armed{color:var(--fg);border-color:var(--accent)} #pull-refresh .pull-ic{font-size:17px;line-height:1;transform:rotate(var(--pull-r,0deg))} #pull-refresh.holding::after{ content:"";position:absolute;left:0;bottom:0;height:2px;background:var(--accent); animation:pullHold .7s linear forwards; } #pull-refresh.reloading .pull-ic{animation:pullSpin .7s linear infinite} @keyframes pullHold{from{width:0}to{width:100%}} @keyframes pullSpin{to{transform:rotate(360deg)}} /* Гостевой режим: у гостя нет Помощника, экрана ПК и выбора стенда — вкладки не «отключены», а убраны, чтобы не мозолили глаза кнопками, которые всё равно ответят «нельзя». */ body.guest nav [data-tab="assist2"], body.guest nav [data-tab="vnc"], body.guest #limits, body.guest #host, body.guest #n-mode, body.guest #n-model, body.guest #n-effort-wrap, body.guest #n-quota-wrap, body.guest #n-attach-wrap, body.guest #n-ops, body.guest label[for], body.guest #n-key{display:none!important} body.guest .wrap{padding-top:4px} /* Вкладка VNC — в css/vnc.css (подключён в ) */ /* шапка */ header{ position:sticky;top:0;z-index:20;background:linear-gradient(180deg,var(--bg) 72%,transparent); padding:calc(8px + var(--sa-top)) var(--pagepad) 6px;display:flex;align-items:center;gap:10px; max-width:var(--page);margin:0 auto;width:100%;box-sizing:border-box; } header h1{font-size:16px;margin:0;font-weight:650;letter-spacing:.2px;flex:1;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis} header h1 small{color:var(--dim);font-weight:400;font-size:12px;margin-left:6px} .live{display:flex;align-items:center;gap:5px;font-size:11px;color:var(--dim)} /* Переключатели вида приложения: режима окна Telegram и темы. */ #dispbtn,#themebtn,#homebtn,#settingsbtn{ display:flex;align-items:center;gap:4px;background:var(--card2);color:var(--dim); border:1px solid var(--line);border-radius:8px;padding:4px 7px;font-size:11px; line-height:1;cursor:pointer;-webkit-tap-highlight-color:transparent; } #dispbtn:active,#themebtn:active,#homebtn:active,#settingsbtn:active{background:var(--line)} #dispbtn b,#themebtn b{font-weight:600;font-size:12px} .dot{width:8px;height:8px;border-radius:50%;background:var(--dim)} .dot.on{background:var(--ok);box-shadow:0 0 8px var(--ok)} .dot.poll{background:var(--warn)} .dot.off{background:var(--bad)} /* плашка резервного узла */ .fallback-banner{ max-width:var(--page);margin:2px auto 6px;padding:8px 12px; background:rgba(255,180,84,0.14);border:1px solid var(--warn);border-radius:10px; display:flex;align-items:center;gap:10px;font-size:13px;color:var(--fg); box-sizing:border-box; } .fallback-banner.recovered{background:rgba(61,220,132,0.14);border-color:var(--ok)} .fallback-warn-ic{width:20px;height:20px;color:var(--warn);flex:none} .fallback-banner.recovered .fallback-warn-ic{color:var(--ok)} .fallback-text{flex:1;min-width:0;line-height:1.35} .fallback-text code{font-family:var(--mono);font-size:12px;background:var(--card2);padding:1px 5px;border-radius:4px} .fallback-check-btn{ background:var(--card2);color:var(--dim);border:1px solid var(--line);border-radius:7px; padding:4px 9px;font-size:11px;cursor:pointer;flex:none;white-space:nowrap; } .fallback-check-btn:active,.fallback-check-btn:hover{color:var(--fg);border-color:var(--accent)} /* Лимиты Claude и Codex живут в общих плашках 5h/7d: окна одни и те же, а процент и время сброса у каждой подписки свои. */ .limits{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin:2px 0 8px} .lim{min-width:0;background:var(--card);border:1px solid var(--line);border-radius:11px;padding:5px 7px} .lim .t{display:flex;justify-content:space-between;font-size:10px;color:var(--dim);margin-bottom:3px;min-width:0} .lim .t span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .lim .v{font-size:16px;font-weight:650;line-height:1} .limrow+.limrow{border-top:1px solid var(--line);margin-top:3px;padding-top:3px} .limmeta{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:baseline;gap:1px 6px;font-size:10px;color:var(--dim)} .limmeta b{font-size:14px;line-height:1;color:var(--fg);font-weight:650} .limname{grid-column:1;grid-row:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--dim)} .limval{grid-column:2;grid-row:1;justify-self:end;text-align:right;white-space:nowrap;display:inline-flex;align-items:baseline} .limval.dual b{font-size:12px} .limsep{color:var(--dim);margin:0 2px;font-weight:400;opacity:.7} .limmeta .reset{grid-column:1 / -1;min-width:0;text-align:right;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:9px;line-height:1.2;color:var(--dim)} .limmeta .reset svg{vertical-align:-1px;margin-right:2px} .limmeta .reset:empty{display:none} .limrow.compact .limmeta{grid-template-columns:minmax(0,1fr) auto;gap:1px 6px;align-items:baseline} .limrow.compact .limmeta b{font-size:14px} /* вместо полоски: у счёта нет «потолка», от которого её считать */ .lim .sub{font-size:10px;color:var(--dim);margin-top:5px;line-height:1.2} .money-compact{display:flex;flex-direction:column;justify-content:center;gap:3px} .money-row{display:flex;align-items:baseline;justify-content:space-between;gap:8px;font-size:11px;line-height:1.25} .money-row b{font-size:13px;font-variant-numeric:tabular-nums;white-space:nowrap} .peak{font-size:11px;line-height:1} .money-row[data-spend]{cursor:pointer} .system-compact > .money-compact{border-top:1px solid var(--line);padding-top:3px} .system-compact > .money-compact:first-child{border-top:none;padding-top:0} .system-compact > .system-server:first-child{border-top:none;padding-top:0} .local-model-line{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:start;min-width:0;margin-top:1px!important} .local-model-label{white-space:nowrap;line-height:22px} .local-model-list{display:flex;flex-direction:column;gap:1px;min-width:0;padding-top:3px} .local-model-list b{min-width:0;line-height:1.25;white-space:normal;overflow-wrap:anywhere} .system-compact{display:flex;flex-direction:column;gap:3px} .system-memory{font-size:9px;color:var(--dim)} .system-server{border-top:1px solid var(--line);padding-top:3px} .system-server-head,.system-disk{display:flex;justify-content:space-between;gap:7px;line-height:1.25} .system-server-head{font-size:10px;align-items:baseline} .system-server-title{display:inline-flex;align-items:center;gap:5px;min-width:0} .server-status-dot{display:inline-block;width:6px;height:6px;border-radius:50%;flex-shrink:0;vertical-align:middle} .server-status-dot.online{background:var(--ok)} .server-status-dot.offline{background:var(--bad);animation:server-dot-blink 1s ease-in-out infinite} @keyframes server-dot-blink{0%,100%{opacity:1}50%{opacity:.18}} .system-server-head > span,.system-server-title > span{color:var(--warn);white-space:nowrap} .system-disk{font-size:9px;color:var(--dim);align-items:baseline} .system-disk b{font-size:10px;color:var(--fg);font-variant-numeric:tabular-nums;white-space:nowrap} .system-memory.bad,.system-disk.bad,.system-disk.bad b{color:var(--bad)} .system-server.stale{opacity:.72} .system-models{display:flex;flex-direction:column;gap:1px;margin-top:2px} .system-model{display:flex;justify-content:space-between;gap:6px;font-size:9px;color:var(--dim);line-height:1.25;align-items:baseline} .system-model span{flex-shrink:0} .system-model b{font-size:9px;color:var(--dim);font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0} .model-status-dot{display:inline-block;width:5px;height:5px;border-radius:50%;flex-shrink:0;vertical-align:middle;margin-right:4px} .model-status-dot.idle{background:var(--ok)} .model-status-dot.busy{background:var(--warn);animation:server-dot-blink 1s ease-in-out infinite} .model-status-dot.offline{background:var(--dim)} .system-model-btn{margin-left:4px;padding:0 3px;border:1px solid rgba(127,127,127,.35);border-radius:4px;font-size:9px;line-height:12px;height:14px;cursor:pointer;background:transparent;color:inherit;vertical-align:middle} .system-model-btn:hover{border-color:var(--fg);background:rgba(127,127,127,.15)} /* раздел на исходе — красным, но плашку целиком не красим: память при этом может быть в порядке, и общий красный врал бы про неё */ .lim .sub.bad{color:var(--bad)} /* Мало места — плашку видно сразу: кончившийся диск останавливает сессии, а не просто мешает, и заметить это надо до, а не после. */ .lim.hot{border-color:var(--bad)} .lim.hot .v{color:var(--bad)} .lim.hot .t{color:var(--bad)} .bar{height:4px;border-radius:3px;background:var(--card2);margin-top:5px;overflow:hidden} .bar i{display:block;height:100%;background:linear-gradient(90deg,var(--ok),var(--warn));transition:width .4s} .bar i.hot{background:linear-gradient(90deg,var(--warn),var(--bad))} /* карточки сессий */ .cards{display:flex;flex-direction:column;gap:9px} .card{ background:var(--card);border:1px solid var(--line);border-radius:var(--radius); padding:11px 13px 11px 15px;position:relative;overflow:hidden;cursor:pointer; transition:transform .12s ease, background .2s; } .card:active{transform:scale(.985);background:var(--card2)} .card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--dim)} .card.busy::before{background:var(--warn)} .card.idle::before{background:var(--ok)} .card.question::before{background:var(--q);animation:pulse 1.6s infinite} .card.draft::before{background:var(--draft)} .card.limit::before{background:var(--bad);animation:pulse 1.6s infinite} .card.shell::before{background:var(--shell)} /* Карточку не удалось собрать: сессия жива, врёт про неё дашборд. Не кликается — деталь упадёт на том же месте, что и карточка. */ .card.broken::before{background:var(--bad)} .card.broken{cursor:default;border-color:var(--bad)} .card.broken:active{transform:none} .errline{color:var(--bad);font-family:ui-monospace,Menlo,Consolas,monospace; font-size:11px;-webkit-line-clamp:4} @keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}} /* сессия закончила ход, но её ещё не открывали — мигает, пока не посмотришь */ @keyframes attn{0%,100%{box-shadow:0 0 0 0 rgba(61,220,132,0)} 50%{box-shadow:0 0 0 3px rgba(61,220,132,.55)}} .card.attn{animation:attn 1.8s ease-in-out infinite} /* safeguards переключили модель — это стоит заметить */ @keyframes warn{0%,100%{box-shadow:0 0 0 0 rgba(255,180,84,0)} 50%{box-shadow:0 0 0 3px rgba(255,180,84,.65)}} .card.warnblink{animation:warn 1.4s ease-in-out infinite} .chip.hot{color:#111;background:var(--warn)} .chip.max{color:#fff;background:var(--bad)} .row1{display:flex;align-items:center;gap:8px} .nm{font-weight:640;font-size:15px} .st{font-size:12px;color:var(--dim);margin-left:auto;white-space:nowrap} .st b{color:var(--fg);font-weight:600} .row2{display:flex;flex-wrap:wrap;gap:6px;margin-top:7px;align-items:center} .chip{ font-size:11px;color:var(--dim);background:var(--card2);border-radius:8px; padding:2px 7px;white-space:nowrap; display:inline-flex;align-items:center;gap:4px; } .chip .ic{width:1.15em;height:1.15em;stroke-width:2} .chip.hi{color:var(--fg)} /* Уровень размышлений: без иконки, мельче остальных чипов, но той же высоты — line-height в px держит строку, текст центрируется по вертикали. */ .chip.effort{color:var(--fg);font-size:7px;line-height:calc(11px * 1.45);font-weight:600} .chip.q{color:#fff;background:var(--q)} .chip[data-term-open]{cursor:pointer} .chip.w{color:#111;background:var(--warn)} .chip.b{color:#fff;background:var(--accent)} /* Пастельные бейджи профилей Antigravity и Codex */ .chip.chip-agy{border:1px solid transparent;font-weight:520} .chip.agy-p-0{background:rgba(180,160,240,.16);color:#cfc2f8;border-color:rgba(180,160,240,.28)} .chip.agy-p-1{background:rgba(125,205,175,.16);color:#9fe3cb;border-color:rgba(125,205,175,.28)} .chip.agy-p-2{background:rgba(240,175,140,.16);color:#f9c4ae;border-color:rgba(240,175,140,.28)} .chip.agy-p-3{background:rgba(135,195,245,.16);color:#a8d6fd;border-color:rgba(135,195,245,.28)} .chip.agy-p-4{background:rgba(235,160,190,.16);color:#f5b5cd;border-color:rgba(235,160,190,.28)} .chip.agy-p-5{background:rgba(230,200,130,.16);color:#eed897;border-color:rgba(230,200,130,.28)} .chip.chip-codex{border:1px solid transparent;font-weight:520} .chip.chip-codex:not([class*="agy-p-"]){background:rgba(100,160,240,.14);color:#a8d4ff;border-color:rgba(100,160,240,.25)} /* Пастельные кнопки режимов при создании новой сессии */ .btn-mode.chip-agy{border:1px solid transparent;font-weight:520} .btn-mode.agy-p-0{background:rgba(180,160,240,.16);color:#cfc2f8;border-color:rgba(180,160,240,.28)} .btn-mode.agy-p-1{background:rgba(125,205,175,.16);color:#9fe3cb;border-color:rgba(125,205,175,.28)} .btn-mode.agy-p-2{background:rgba(240,175,140,.16);color:#f9c4ae;border-color:rgba(240,175,140,.28)} .btn-mode.agy-p-3{background:rgba(135,195,245,.16);color:#a8d6fd;border-color:rgba(135,195,245,.28)} .btn-mode.agy-p-4{background:rgba(235,160,190,.16);color:#f5b5cd;border-color:rgba(235,160,190,.28)} .btn-mode.agy-p-5{background:rgba(230,200,130,.16);color:#eed897;border-color:rgba(230,200,130,.28)} .btn-mode.chip-codex{border:1px solid transparent;font-weight:520} .btn-mode.chip-codex:not([class*="agy-p-"]){background:rgba(100,160,240,.14);color:#a8d4ff;border-color:rgba(100,160,240,.25)} body.light .chip.agy-p-0{background:#f0ecfc;color:#543b91;border-color:#dcd2f6} body.light .chip.agy-p-1{background:#e4f7f0;color:#1f6850;border-color:#c2ece0} body.light .chip.agy-p-2{background:#fef0e9;color:#8c4524;border-color:#f9d2c2} body.light .chip.agy-p-3{background:#e7f3fd;color:#205e97;border-color:#c5e2fa} body.light .chip.agy-p-4{background:#fdedf4;color:#88385a;border-color:#f8cddf} body.light .chip.agy-p-5{background:#fcf5e3;color:#755b18;border-color:#f3e2b2} body.light .chip.chip-codex:not([class*="agy-p-"]){background:#edf5fd;color:#1e5b94;border-color:#c8e1fa} body.light .btn-mode.agy-p-0{background:#f0ecfc;color:#543b91;border-color:#dcd2f6} body.light .btn-mode.agy-p-1{background:#e4f7f0;color:#1f6850;border-color:#c2ece0} body.light .btn-mode.agy-p-2{background:#fef0e9;color:#8c4524;border-color:#f9d2c2} body.light .btn-mode.agy-p-3{background:#e7f3fd;color:#205e97;border-color:#c5e2fa} body.light .btn-mode.agy-p-4{background:#fdedf4;color:#88385a;border-color:#f8cddf} body.light .btn-mode.agy-p-5{background:#fcf5e3;color:#755b18;border-color:#f3e2b2} body.light .btn-mode.chip-codex:not([class*="agy-p-"]){background:#edf5fd;color:#1e5b94;border-color:#c8e1fa} .proj{font-size:11px;color:var(--dim);margin-top:6px;font-family:var(--mono); overflow:hidden;text-overflow:ellipsis;white-space:nowrap} /* Проект в карточке виден, когда группировка выключена: там его больше негде прочитать, а имя сессии теперь только про задачу. Иконка папки — та же, что в заголовке группы, чтобы строка читалась одинаково в обоих режимах. */ .proj .ic{width:12px;height:12px;stroke-width:1.9;vertical-align:-2px;margin-right:4px} /* заголовки секций */ h2{font-size:12px;text-transform:uppercase;letter-spacing:.6px;color:var(--dim); margin:18px 4px 8px;font-weight:600} /* вопросы */ .ask{background:linear-gradient(180deg,rgba(199,139,255,.14),var(--card)); border:1px solid rgba(199,139,255,.45);border-radius:var(--radius);padding:12px;margin-bottom:9px} .ask .h{font-weight:640;margin-bottom:4px} .ask .q{font-size:13px;color:var(--fg);margin-bottom:9px;white-space:pre-wrap; overflow-wrap:anywhere} .ask .q.askq-collapsed{max-height:12em;overflow:hidden} .askq-expand{margin:-3px 0 8px} .ask.btw .btwq{max-height:52vh;overflow:auto} .opt{display:block;width:100%;text-align:left;margin:5px 0;padding:9px 11px;border-radius:10px; background:var(--card2);border:1px solid var(--line);color:var(--fg);font-size:14px; overflow-wrap:anywhere} .opt:active{background:var(--accent);color:#fff} .opt small{display:block;color:var(--dim);font-size:11px;margin-top:2px; white-space:normal;overflow-wrap:anywhere} .opt.sel{border-color:var(--q)} /* Окно вопроса внутри сессии (TF-116, js/ask-modal.js): немодальное, поверх «Диалога» и «Экрана», без затемнения. Телефон — прижато к низу над полем ввода, не выше ~половины экрана; десктоп — колонка справа. Лента под ним получает отступ на высоту окна (--ask-h), так что хвост диалога и терминала читается над окном или рядом с ним. Цвета — прежние .ask. */ #d-asks{position:absolute;left:8px;right:8px;z-index:46; bottom:calc(var(--dfoot-h,132px) + 8px);max-height:min(50%,440px); display:flex;flex-direction:column;border-radius:var(--radius);background:var(--card); box-shadow:0 10px 34px rgba(0,0,0,.42)} #d-asks.hidden{display:none} #d-asks .askm{margin:0;padding:10px 12px;display:flex;flex-direction:column;min-height:0;flex:1 1 auto} .askm-head{display:flex;align-items:center;gap:8px;flex:none} .askm-head .h{flex:1 1 auto;min-width:0;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .askm-count{flex:none;font-size:11.5px;color:var(--dim);white-space:nowrap} .askm-fold{flex:none;padding:4px 7px} .askm-steps{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin:8px 0 2px;flex:none} .askm-step{min-width:30px;height:26px;padding:0 8px;border-radius:13px;border:1px solid rgba(199,139,255,.45); background:var(--card2);color:var(--fg);font-size:12.5px;font-weight:640;display:inline-flex; align-items:center;justify-content:center} .askm-step.on{background:var(--q);border-color:var(--q);color:#fff} .askm-step.done{opacity:.55;color:var(--ok)} .askm-step .ic{width:13px;height:13px} .askm-body{overflow:auto;min-height:0;flex:1 1 auto;margin-top:6px;overscroll-behavior:contain} .askm-hint{font-size:11.5px;color:var(--dim);margin:-4px 0 4px} .askm-foot{flex:none;margin-top:8px} .askm-next{margin-left:auto;padding:3px 9px} .askm-pill{display:flex;align-items:center;gap:7px;width:100%;padding:10px 12px;border-radius:var(--radius); background:linear-gradient(180deg,rgba(199,139,255,.2),var(--card));border:1px solid var(--q); color:var(--fg);font-size:13.5px;text-align:left} .askm-pill b{color:var(--q);flex:none} .askm-pill-t{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .askm-n{flex:none;background:var(--q);color:#fff;border-radius:9px;font-size:11px;padding:1px 7px;font-weight:700} .askm-go{flex:none;display:inline-flex;align-items:center;gap:3px;color:var(--dim);font-size:12px} .askm-go .ic{width:13px;height:13px} /* Ручка перетаскивания (ask-modal.js, askDragStart): точки 3×4, палец и мышь; touch-action:none — иначе телефон вместо перетаскивания листает. */ .askm-grip{flex:none;align-self:stretch;width:16px;min-height:24px;margin:-4px 0 -4px -4px; border-radius:6px;cursor:grab;touch-action:none;opacity:.65; background:radial-gradient(circle,var(--dim) 1.3px,transparent 1.7px) 2px 3px/6px 6px} .askm-grip:hover{opacity:1;background-color:var(--card2)} #d-asks.moved{right:auto;bottom:auto;width:min(400px,calc(100% - 16px))} #d-asks.dragging{user-select:none;opacity:.94} #d-asks.dragging .askm-grip{cursor:grabbing} #detail.asking .dbody{padding-bottom:calc(var(--ask-h,0px) + 20px); scroll-padding-bottom:calc(var(--ask-h,0px) + 20px)} #detail.asking #scrollbtns{bottom:calc(var(--dfoot-h,132px) + var(--ask-h,0px) + 16px)} @media (min-width:900px){ /* Десктоп: колонка справа, «Диалог» переносится левее окна и читается целиком; «Экран» — широкий терминал, ему остаётся отступ снизу. */ #d-asks{left:auto;right:14px;width:min(400px,46%);max-height:calc(100% - var(--dfoot-h,132px) - 130px)} #detail.asking:not(.term-dark) .dbody{padding-bottom:16px; padding-right:calc(min(400px,46%) + 22px)} #detail.asking:not(.term-dark) #scrollbtns{bottom:150px} /* Окно сдвинуто рукой: колонку справа под него больше не держим. */ #detail.asking.ask-moved:not(.term-dark) .dbody{padding-right:16px} } /* иконки: один инлайновый спрайт вместо эмодзи — они рисуются шрифтом системы и в Telegram WebView на Android/iOS/десктопе выглядят по-разному (цветные, разного кегля, часть подменяется квадратами). SVG наследует цвет и кегль. */ .ic{width:1.15em;height:1.15em;flex:none;fill:none;stroke:currentColor; stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round; vertical-align:-.2em;pointer-events:none} .ic.sm{width:1em;height:1em;stroke-width:1.9} /* кнопки/формы */ button{font:inherit;cursor:pointer;border:none;background:none;color:inherit} .btn{background:var(--card2);border:1px solid var(--line);border-radius:10px; padding:8px 12px;font-size:13px;color:var(--fg);white-space:nowrap; text-transform:none;letter-spacing:normal; display:inline-flex;align-items:center;justify-content:center;gap:6px} .btn:active{background:var(--accent);color:#fff} .btn.pri{background:var(--accent);color:#fff;border-color:transparent;font-weight:600} .btn.bad{color:var(--bad)} .btn.sm{padding:6px 9px;font-size:12px} .btns{display:flex;gap:7px;flex-wrap:wrap} .n-picker-row{display:flex;align-items:center;gap:9px;margin:0 0 9px} .n-picker-label{width:54px;flex:none;font-size:11px;color:var(--dim);text-transform:uppercase;letter-spacing:.3px} .n-picker{min-width:0;max-width:calc(100% - 63px);overflow:hidden;text-overflow:ellipsis} .n-picker > span{overflow:hidden;text-overflow:ellipsis} .n-mode-chips{margin:0 0 9px} .n-form-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:9px} .n-form-row > div{min-width:0} .n-form-row label{display:block;margin:0 0 4px} .n-create-actions{align-items:center} .n-create-actions #n-go{margin-left:auto} #n-mode .btn-mode{transition:all .15s ease} #n-mode .btn-mode.pri{ outline:2px solid var(--accent); outline-offset:1px; box-shadow:0 0 8px rgba(199,139,255,.35); } #n-mode .btn-mode:disabled, #n-mode .btn-mode.disabled{ opacity:.42 !important; cursor:not-allowed !important; filter:grayscale(1) !important; background:var(--card2) !important; color:var(--dim) !important; border-color:var(--line) !important; box-shadow:none !important; outline:none !important; } .nmode-pct{ font-size:11px; font-variant-numeric:tabular-nums; font-weight:600; padding:1px 5px; border-radius:4px; background:rgba(0,0,0,.22); margin-left:2px; } body.light .nmode-pct{ background:rgba(0,0,0,.08); } input,textarea,select{ width:100%;background:var(--card2);border:1px solid var(--line);border-radius:10px; color:var(--fg);padding:10px 12px;font:inherit;outline:none;resize:none; } input:focus,textarea:focus{border-color:var(--accent)} #n-model{font-size:12px;padding:8px 10px} #n-quota-wrap{margin-top:6px} .nquota-card{ background:var(--card2);border:1px solid var(--line);border-radius:10px; padding:8px 12px;display:flex;flex-direction:column;gap:5px;font-size:11.5px; } .nquota-row{ display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;line-height:1.4; } .nquota-lbl{ font-weight:700;font-size:11px;color:var(--dim);text-transform:uppercase;letter-spacing:.3px; min-width:32px; } .nquota-vals{ color:var(--fg);font-variant-numeric:tabular-nums;font-size:11.5px; } .nquota-reset{ color:var(--dim);font-size:11px;font-variant-numeric:tabular-nums;margin-left:auto;white-space:nowrap; } .nquota-warn{ display:flex;align-items:center;gap:6px;font-size:11px;padding:3px 8px;border-radius:6px;margin-top:2px; } .nquota-warn.warn{ color:var(--warn);background:rgba(255,180,84,.08);border:1px solid rgba(255,180,84,.25); } .nquota-warn.bad{ color:var(--bad);background:rgba(255,93,93,.08);border:1px solid rgba(255,93,93,.25); } .nquota-warn .ic{width:13px;height:13px;flex:none} /* Pickers keep long catalogues out of the New-session form. */ .n-picker-modal{position:fixed;inset:0;z-index:90;background:#000a;display:flex;align-items:center; justify-content:center;padding:20px;backdrop-filter:blur(3px)} .n-picker-modal.hidden{display:none!important} .n-picker-modal .mbox{background:var(--card);border:1px solid var(--line);border-radius:16px; padding:16px;width:min(520px,100%);box-shadow:0 20px 50px rgba(0,0,0,.5)} .n-picker-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px} .n-picker-head .mtitle{margin:0;font-size:14px} .n-picker-modal input{margin-bottom:10px} .n-picker-list{max-height:60vh;overflow:auto;padding:1px} .n-picker-list .btn{max-width:100%;overflow:hidden;text-overflow:ellipsis} .n-dir-tree{max-height:60vh;overflow:auto;padding:1px} .n-dir-node{display:flex;align-items:center;min-width:0;padding-left:calc(var(--dir-depth) * 13px)} .n-dir-arrow{width:28px;min-width:28px;padding:5px 3px;border-color:transparent;color:var(--dim)} .n-dir-arrow[disabled]{visibility:hidden} .n-dir-name{min-width:0;flex:1;justify-content:flex-start;padding:5px 7px;font-size:12px;overflow:hidden;text-overflow:ellipsis} .n-dir-name.selected{border-color:var(--accent);background:rgba(199,139,255,.16)} .n-dir-action{width:26px;min-width:26px;padding:4px 2px;border-color:transparent;color:var(--dim)} .n-dir-action.on{color:#f2cf5b} .n-dir-section{padding:8px 7px 3px;font-size:10px;font-weight:650;color:var(--dim);text-transform:uppercase;letter-spacing:.05em} .n-dir-favorite{padding-left:0} .n-dir-hidden-toggle{width:100%;justify-content:flex-start;margin-top:5px;padding:5px 7px;font-size:11px;color:var(--dim)} .n-dir-hidden{padding-left:0;opacity:.72} @media (max-width:430px){ .n-form-row{gap:7px} .n-form-row input,.n-form-row select{padding-left:9px;padding-right:9px} .n-create-actions #n-go{margin-left:0} } /* поиск над списком сессий */ .search{position:relative;display:flex;align-items:center;margin:0 0 10px} /* Только ПРЯМОЙ svg — иначе правило ловит и иконку внутри крестика, и та уезжает absolute'ом к лупе, а сама кнопка остаётся пустой справа. */ .search > svg.ic{position:absolute;left:11px;top:50%;transform:translateY(-50%); color:var(--dim);pointer-events:none} .search input{padding-left:36px;padding-right:38px} /* Поиск свёрнут в кнопку на всех ширинах (Сергей 26.09.2026). */ .search{display:none} .search.open{display:flex} .search-toggle{display:inline-flex;margin:0 0 10px} #grp-toggle{height:31px} .qx{position:absolute;right:6px;top:50%;transform:translateY(-50%); background:none;border:none;color:var(--dim);padding:6px;cursor:pointer; display:flex;align-items:center;line-height:0} .found{margin:0 0 12px} .found h3{font-size:11px;color:var(--dim);text-transform:uppercase;letter-spacing:.5px; margin:0 2px 7px;font-weight:600;display:flex;justify-content:space-between} .hitcard{background:var(--card);border:1px solid var(--line);border-radius:var(--radius); padding:9px 11px;margin-bottom:7px} .hitcard .nm{font-weight:600;font-size:13px;display:flex;align-items:center;gap:6px} .hitcard .nm .ic{color:var(--dim);flex:none} .hit{display:block;width:100%;text-align:left;background:var(--card2);border:1px solid var(--line); border-radius:9px;color:var(--fg);font:inherit;font-size:12.5px;line-height:1.45; padding:7px 9px;margin-top:6px;cursor:pointer} .hit:active{border-color:var(--accent)} .hit .who{font-size:10px;letter-spacing:.6px;text-transform:uppercase;color:var(--dim); margin-bottom:3px;display:flex;justify-content:space-between;gap:8px} .hit mark{background:color-mix(in srgb,var(--accent) 35%,transparent);color:inherit;border-radius:3px} /* реплика, на которую прыгнули из поиска */ .msg.jump,.tool.jump{box-shadow:inset 3px 0 0 var(--accent)} /* Закрытый разговор: сессии за ним уже нет, поэтому от панели остаётся только «Диалог» — ни экрана, ни промпта, ни кнопок управления. */ #detail.ro .dhead .btn:not(#d-back), #detail.ro .tabs [data-dtab]:not([data-dtab="chat"]), #detail.ro .dfoot{display:none} .rotag{font-size:10px;color:var(--dim);text-transform:uppercase;letter-spacing:.5px} /* Пометка режима — псевдоэлементом: вложенный span распирал .nm, у которого nowrap и ellipsis, и шапка разъезжалась на длинном заголовке. */ #detail.ro .dhead .nm::after{content:" · закрытый разговор";color:var(--dim); font-size:11px;font-weight:400} #detail.ro .dbody{padding-bottom:env(safe-area-inset-bottom)} label{display:block;font-size:11px;color:var(--dim);margin:10px 2px 4px;text-transform:uppercase;letter-spacing:.5px} .check{display:flex;align-items:flex-start;gap:9px;background:var(--card2); border:1px solid var(--line);border-radius:10px;padding:9px 11px;margin:10px 0 4px; color:var(--fg);font-size:13px;line-height:1.35;text-transform:none;letter-spacing:0;cursor:pointer} .check input{width:18px;height:18px;margin:0;flex:none;accent-color:var(--accent)} /* нижняя навигация */ nav{ position:fixed;left:0;right:0;bottom:0;z-index:30;display:flex; background:color-mix(in srgb,var(--card) 92%,transparent); backdrop-filter:blur(14px);border-top:1px solid var(--line); padding-bottom:var(--sa-bottom); } nav button{flex:1;padding:9px 0 7px;font-size:10px;color:var(--dim);display:flex; flex-direction:column;align-items:center;gap:3px} nav button.on{color:var(--accent)} nav button .ic{width:21px;height:21px;stroke-width:1.6} nav .badge{position:absolute;transform:translate(14px,-4px);background:var(--bad); color:#fff;border-radius:9px;font-size:9px;padding:1px 5px;font-weight:700} /* экран сессии */ #detail-backdrop{display:none} #detail{position:fixed;inset:0;z-index:40;background:var(--bg);display:flex; flex-direction:column;transform:translateX(100%);transition:transform .22s ease; visibility:hidden;pointer-events:none} #detail.open{transform:none;visibility:visible;pointer-events:auto} #detail.term-dark{ --bg:#0f1115; --card:#171a21; --card2:#1e222b; --line:#262b36; --fg:#e8ecf2; --dim:#8b93a3; color-scheme:dark; background:var(--bg); color:var(--fg); } #detail.term-dark .dhead, #detail.term-dark .tabs{background:var(--bg)} #detail.term-dark .dbody{background:#101217} #detail.term-dark input::placeholder, #detail.term-dark textarea::placeholder{color:var(--dim)} .dhead{display:flex;align-items:center;gap:9px;padding:10px 12px;border-bottom:1px solid var(--line); padding-top:calc(10px + var(--sa-top))} .dhead .nm{flex:0 1 auto;min-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:pointer} .dhead-gap{flex:1 1 auto;min-width:0} /* Состояние сессии — только иконка (подпись в title), чтобы строка заголовка вместе с кнопками оставалась одной строкой. */ .dstate{flex:0 0 auto;display:inline-flex;align-items:center;color:var(--dim);line-height:1} .dstate .ic{width:16px;height:16px;stroke-width:1.9} .dstate.busy{color:var(--accent);animation:pulse 1.6s ease-in-out infinite} .dstate.hidden{display:none!important} /* Имя — инлайн-правка по тапу. */ .dhead .nm.editing{overflow:visible;text-overflow:clip} .dname-input{width:min(46vw,240px);font:inherit;font-weight:640;font-size:15px; color:var(--fg);background:var(--card2);border:1px solid var(--accent); border-radius:7px;padding:1px 6px;min-width:0} /* Лимиты подписки текущей сессии: на десктопе рядом с названием, на телефоне отдельной строкой под шапкой и над вкладками «Диалог/Экран» (см. media). */ .dhead-limits{flex:0 0 auto;display:flex;align-items:center;flex-wrap:nowrap;gap:5px 8px;min-width:0;max-width:100%; overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none} .dhead-limits::-webkit-scrollbar{display:none} .dhead-limits.hidden{display:none!important} .dlim-win{display:inline-flex;align-items:center;gap:5px;background:var(--card2);border:1px solid var(--line);border-radius:999px;padding:2px 8px;font-size:10.5px;line-height:1.45;white-space:nowrap} .dlim-wlbl{display:inline-flex;align-items:center;color:var(--dim);font-weight:650;font-size:9.5px;text-transform:uppercase;letter-spacing:.3px} .dlim-wlbl .ic{width:12px;height:12px;stroke-width:2} .dlim-bar{width:42px;height:5px;border-radius:3px;background:rgba(255,255,255,.12);overflow:hidden;flex:none} .dlim-bar i{display:block;height:100%;border-radius:3px;background:var(--accent);transition:width .3s ease} .dlim-pct{font-variant-numeric:tabular-nums;font-weight:700;min-width:29px;text-align:right} .dlim-win.normal .dlim-pct{color:var(--fg)} .dlim-win.warning .dlim-pct{color:var(--warn)} .dlim-win.critical .dlim-pct{color:var(--bad)} .dlim-win.unknown .dlim-pct{color:var(--dim)} .dlim-reset{color:var(--dim);font-size:9.5px;font-variant-numeric:tabular-nums;white-space:nowrap} .dlim-gname{display:inline-flex;align-items:center;color:var(--dim);font-size:9.5px;font-weight:700;text-transform:uppercase;letter-spacing:.4px} /* Брендовые метки/иконки агентов (заливка, не обводка): Gemini, OpenAI, OpenCode, Claude, DeepSeek. Кегль — как у .ic, чтобы совпадать в чипах. */ .dic{width:1.15em;height:1.15em;flex:none;display:inline-block;fill:currentColor; stroke:none;vertical-align:-.2em;pointer-events:none} .dlim-gname .dic{width:14px;height:14px;vertical-align:0} .dlim-money .dlim-wlbl .dic{width:13px;height:13px;vertical-align:0} .dlim-stale{color:var(--warn);font-size:11px;line-height:1} /* Затраты текущего разговора OpenCode (RouterAI, DeepSeek) — те же пилюли, что у лимитов, но без прогресс-бара. */ .dlim-money .dlim-pct{min-width:0;font-weight:650} /* Модель и уровень размышления сессии в шапке (десктоп) — те же пилюли. */ .dlim-model{color:var(--fg);font-weight:600} /* Та же высота, что у соседних бейджей в шапке (10.5px * 1.45). */ .dlim-effort{font-size:7px;line-height:calc(10.5px * 1.45)} /* Смена профиля Codex: свёрнутый чип с текущим профилем, селект и переключатель раскрываются под ним. Так блок не тянет строку имени и не расползается капсом. Перебиваем глобальный label (block/uppercase/отступы) и мельчим select. */ .d-profile-actions{flex:0 0 auto} .d-profile-actions[open]{flex:0 0 auto} .d-profile-actions>summary{list-style:none;cursor:pointer} .d-profile-toggle{color:var(--fg);font-weight:600;gap:5px} .d-profile-toggle::-webkit-details-marker{display:none} .d-profile-actions>summary::after{content:'▾';color:var(--dim);font-size:9px;margin-left:1px} .d-profile-actions[open]>summary::after{content:'▴'} .d-profile-menu{display:flex;align-items:center;gap:4px;flex-wrap:wrap;margin-top:5px} .d-profile-actions select{font:inherit;font-size:10.5px;line-height:1.45;color:var(--fg); background:var(--card2);border:1px solid var(--line);border-radius:999px; padding:2px 6px;max-width:145px;min-width:0} .d-profile-actions .btn.sm{padding:2px 9px;font-size:10.5px;line-height:1.45;border-radius:999px} .d-profile-actions label{display:inline-flex;align-items:center;gap:4px;margin:0; font-size:10px;color:var(--dim);text-transform:none;letter-spacing:0;white-space:nowrap} .d-profile-actions input[type=checkbox]{margin:0;width:13px;height:13px;flex:none} body.light .dlim-bar{background:rgba(0,0,0,.12)} body.light .dlim-win.warning .dlim-pct{color:#925200} body.light .dlim-win.critical .dlim-pct{color:#b42332} .tabs{display:flex;gap:6px;padding:8px 12px;border-bottom:1px solid var(--line);overflow-x:auto} .tabs button{font-size:12px;padding:6px 11px;border-radius:9px;background:var(--card2);color:var(--dim)} .tabs button.on{background:var(--accent);color:#fff} .worker-tab-count{display:inline-grid;place-items:center;min-width:17px;height:17px;margin-left:6px;padding:0 4px; border-radius:9px;background:var(--warn);color:#171a21;font-size:10px;font-weight:750;line-height:1;vertical-align:1px} .worker-tab-count[hidden]{display:none} .tabs button.on .worker-tab-count{background:#fff;color:var(--accent)} .dbody{flex:1;overflow:auto;-webkit-overflow-scrolling:touch; padding-bottom:16px;scroll-padding-bottom:16px} #term{margin:0;padding:10px env(safe-area-inset-right) 10px env(safe-area-inset-left);font-family:var(--mono);font-size:var(--term-fs,11px);line-height:1.34; white-space:pre;overflow-x:auto;color:var(--fg)} .msg{padding:10px 13px;border-bottom:1px solid var(--line);font-size:14px;white-space:pre-wrap; word-break:break-word;overflow-wrap:anywhere} .msg .who{font-size:10px;letter-spacing:.6px;text-transform:uppercase;color:var(--dim);margin-bottom:5px} .msg.user{background:var(--card2)} .msg.user .who{color:var(--accent)} .msg.pending{background:color-mix(in srgb,var(--q,var(--accent)) 9%,var(--bg)); border-left:3px solid var(--q,var(--accent));opacity:.88} .msg.pending .who{color:var(--q,var(--accent))} /* Вывод подагентов — не основная реплика: заметен в ленте, но не смешивается ни с сообщениями Сергея, ни с итогом ведущего агента. */ .msg.subagent{background:color-mix(in srgb,var(--q,var(--accent)) 8%,var(--card)); border-left:3px solid var(--q,var(--accent))} .msg.subagent .who{color:var(--q,var(--accent))} /* уведомление о фоновой задаче: не реплика, а служебная строка */ .msg.note{display:flex;align-items:center;gap:7px;white-space:normal; color:var(--dim);font-size:12px;padding:7px 13px} .msg.note .ic{color:var(--q,var(--accent));flex:none} .msg.note span{flex:1;overflow-wrap:anywhere} /* Вызов инструмента — свёрнутая карточка: в ленте видно, ЧТО делалось, а простыни вывода не мешают читать сам разговор. */ .tool{white-space:normal;padding:0;background:transparent} .tool summary,.toolgrp>summary{display:flex;align-items:center;gap:7px;padding:8px 13px;cursor:pointer; color:var(--dim);font-size:12px;font-family:var(--mono);list-style:none} .tool summary::-webkit-details-marker,.toolgrp>summary::-webkit-details-marker{display:none} .tool summary span,.toolgrp>summary span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1} .tool summary .ic,.toolgrp>summary .ic{color:var(--shell);flex:none} .tool[open]>summary,.toolgrp[open]>summary{color:var(--fg);border-bottom:1px solid var(--line)} .tool pre,.tool .tres{margin:0;padding:9px 13px;font-family:var(--mono);font-size:11.5px; white-space:pre-wrap;word-break:break-word;overflow-wrap:anywhere;max-height:340px;overflow:auto} .tool pre{background:var(--card2);color:var(--fg)} .tool .tres{background:var(--card);color:var(--dim);border-top:1px solid var(--line)} /* Второй уровень: цепочка вызовов между двумя репликами складывается целиком. Свёрнутых карточек подряд бывает по три десятка — сам разговор в них тонет, а раскрывать их поштучно надо редко (10.08.2026). */ .toolgrp{white-space:normal;padding:0;background:transparent} .toolgrp>summary{background:var(--card2)} .toolgrp>summary b{font-family:inherit;color:var(--fg);font-weight:600} .toolgrp>summary b.err{color:var(--bad)} /* Провалившийся вызов краснеет целиком — и строка-заголовок, и результат: ошибку видно в аккордеоне без раскрытия и не приходится искать её глазами. */ .tool.err>summary{color:var(--bad);background:color-mix(in srgb,var(--bad) 12%,var(--card2))} .tool.err>summary .ic{color:var(--bad)} .tool.err[open]>summary{color:var(--bad);border-bottom-color:var(--bad)} .tool .tres.err{color:var(--bad);background:color-mix(in srgb,var(--bad) 8%,var(--card))} .tgrp{border-left:2px solid var(--line);margin-left:13px} /* Внутри одного аккордеона могут чередоваться вызовы и рассуждения: строку между ними рисуем на верхней границе каждого следующего элемента. */ .tgrp>*+*{border-top:1px solid var(--line)} .tgrp .service{border-bottom:none} /* Инструкции harness/оркестратора бывают длиннее самого диалога. Показываем факт их получения, а тело оставляем в обычном нативном аккордеоне. */ .service{white-space:normal;padding:0;background:var(--card2);border-bottom:1px solid var(--line)} .service summary{display:flex;align-items:center;gap:7px;padding:8px 13px;cursor:pointer; color:var(--dim);font-size:12px;list-style:none} .service summary::-webkit-details-marker{display:none} .service summary span{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .service summary .ic{color:var(--shell);flex:none} .service[open]>summary{color:var(--fg);border-bottom:1px solid var(--line)} .service .service-body{margin:0;padding:9px 13px;max-height:340px;overflow:auto; white-space:pre-wrap;word-break:break-word;overflow-wrap:anywhere; color:var(--dim);font:11.5px/1.4 var(--mono)} .msg code{font-family:var(--mono);font-size:12px;background:var(--card2);border-radius:5px;padding:1px 4px} .msg.md{white-space:normal;overflow-wrap:anywhere} /* Панель не должна ездить вбок: широкое (код, таблицы) скроллится внутри своих блоков, у них для этого есть overflow-x. */ .dbody{overflow-x:hidden} #chat,#chat .msg,#chat .tool{max-width:100%} /* Режим выделения сообщений (удержание → короткие тапы). Системный вызов контекстного меню перехватил бы удержание, поэтому в ленте он выключен; на тач-устройствах заодно запрещено выделение текста — иначе оно спорит с отметками. На десктопе выделение текста остаётся. */ #chat{-webkit-touch-callout:none} @media (hover:none){ #chat{user-select:none;-webkit-user-select:none} } #chat.selmode [data-b]{cursor:pointer} #chat.selmode .selon{outline:2px solid var(--accent);outline-offset:-2px; background:color-mix(in srgb,var(--accent) 12%,transparent)} .selbar{display:flex;align-items:center;gap:8px;border-top:1px solid var(--line); padding:9px 12px;background:var(--card)} .selbar.hidden{display:none} .selbar .selcount{flex:1;min-width:0;font-size:12px;color:var(--dim)} #detail.ro .selbar{padding-bottom:calc(9px + var(--sa-bottom))} /* Инлайн-выделение части одной реплики: узел сделан редактируемым, поэтому выделение текста в нём разрешено даже там, где обычно выключено. */ #chat .selin{outline:2px solid var(--accent);outline-offset:-2px;position:relative; background:color-mix(in srgb,var(--accent) 8%,transparent)} #chat .selin,#chat .selin *{user-select:text;-webkit-user-select:text} #chat .selin-x{position:absolute;top:4px;right:4px;z-index:3;width:24px;height:24px; padding:0;border:0;border-radius:50%;background:var(--accent);color:#fff; font-size:16px;line-height:1;display:flex;align-items:center;justify-content:center; cursor:pointer} .msg.md p{margin:0 0 8px} .msg.md h1,.msg.md h2,.msg.md h3{font-size:14px;margin:12px 0 6px;font-weight:660; letter-spacing:.2px;text-transform:none;color:var(--fg)} .msg.md h1{font-size:16px} .msg.md ul,.msg.md ol{margin:0 0 8px;padding-left:20px} .msg.md li>ul,.msg.md li>ol{margin:4px 0 2px;padding-left:20px} .msg.md li{margin:2px 0} .msg.md .md-task{display:inline-flex;align-items:baseline;gap:5px} .msg.md .md-task input{margin:0;accent-color:var(--accent)} .msg.md pre{background:var(--card2);border:1px solid var(--line);border-radius:9px; padding:8px 10px;overflow-x:auto;margin:0 0 8px} .msg.md pre code{background:none;padding:0;font-size:11.5px;line-height:1.4;display:block} .msg.md blockquote{margin:0 0 8px;padding:2px 0 2px 10px;border-left:3px solid var(--line);color:var(--dim)} .msg.md table{border-collapse:collapse;margin:0 0 8px;font-size:12px;display:block;overflow-x:auto} .msg.md th,.msg.md td{border:1px solid var(--line);padding:4px 7px;text-align:left} .msg.md th{background:var(--card2)} .msg.md .a-c{text-align:center}.msg.md .a-r{text-align:right}.msg.md .a-l{text-align:left} .msg.md hr{border:none;border-top:1px solid var(--line);margin:10px 0} #chat a{color:var(--accent);word-break:break-all;cursor:pointer} #chat a:hover{text-decoration:underline} #chat a.md-file{font-family:var(--mono);font-size:12px;text-decoration-style:dotted} #chat a.md-tyaptask{text-decoration-style:dashed} .tool pre a,.tres a,.service-body a,.msg.note a{text-decoration:underline} .msg.md a{word-break:break-all} .msg.md .md-callout{margin:8px 0;padding:8px 10px;border:1px solid var(--line); border-left:3px solid var(--accent);border-radius:8px;background:var(--card2)} .msg.md .md-callout.service{border-left-color:var(--q,var(--accent))} .msg.md .md-callout-title{font-size:10px;letter-spacing:.45px;text-transform:uppercase; color:var(--accent);font-weight:650;margin-bottom:4px} .msg.md .md-callout.service .md-callout-title{color:var(--q,var(--accent))} .msg.md .md-callout p:last-child{margin-bottom:0} .msg.md :last-child{margin-bottom:0} /* Прокрутка экрана — плавающими кнопками поверх терминала: в общем ряду они уезжали за правый край и их «не было» (06.08.2026). */ #scrollbtns{position:absolute;right:12px;bottom:150px;z-index:45; display:flex;flex-direction:column;gap:8px} #scrollbtns button{width:40px;height:40px;border-radius:50%;font-size:17px; display:flex;align-items:center;justify-content:center; color:var(--fg);border:1px solid var(--line);backdrop-filter:blur(8px); background:color-mix(in srgb,var(--card2) 88%,transparent); box-shadow:0 4px 14px rgba(0,0,0,.35)} #scrollbtns button:active{background:var(--accent);color:#fff} .dfoot{border-top:1px solid var(--line);padding:9px 12px calc(9px + var(--sa-bottom)); background:var(--card);display:flex;flex-direction:column;gap:8px} .sendrow{display:flex;gap:8px;align-items:flex-end; /* Высота пустого поля промпта: строка (15px × 1.45) + padding 2×10 + рамки. У .btn свои padding и line-height:1, а внутри только иконка, поэтому кнопки выходили на ~9px ниже поля — задаём им ту же высоту явно (08.08.2026). Заодно спиннер при отправке не меняет размер кнопки. */ --sendh:calc(1.45 * 15px + 22px)} .worker-interrupt-row{display:flex;align-items:center;gap:7px;margin:0 2px; color:var(--text-dim);font-size:12px;cursor:pointer; text-transform:none;letter-spacing:0;white-space:nowrap} .worker-interrupt-row input{margin:0;accent-color:var(--accent);width:15px;height:15px; padding:0;flex:none;border:0;border-radius:3px;background:none} .sendrow .btn{height:var(--sendh)} .sendrow textarea{height:var(--sendh);max-height:130px;min-height:var(--sendh)} #d-rec,#n-rec,#d-clip{flex:0 0 auto} /* Push-to-talk сам владеет жестом: WebView не должен превращать небольшое движение пальца в scroll и присылать pointercancel вместо pointerup. */ #d-rec,#n-rec{touch-action:none;user-select:none;-webkit-user-select:none} /* Длинный промпт получает всю ширину строки. Три действия остаются рядом, но складываются в узкую колонку: так на телефоне видно около шести строк текста вместо двух-трёх, а кнопки не перекрывают поле. */ .sendrow.prompt-tall{display:grid;grid-template-columns:minmax(0,1fr) var(--sendh); grid-template-rows:repeat(3,var(--sendh));--sendstack:calc(var(--sendh) + var(--sendh) + var(--sendh) + 16px)} .sendrow.prompt-tall textarea{grid-column:1;grid-row:1/4;min-height:var(--sendstack); max-height:var(--sendstack)} .sendrow.prompt-tall #d-clip{grid-column:2;grid-row:1} .sendrow.prompt-tall #d-rec{grid-column:2;grid-row:2} .sendrow.prompt-tall #d-send{grid-column:2;grid-row:3} /* margin, text-transform и цвет — от общего правила `label` (подписи полей): из-за его `margin:10px 2px 4px` скрепка висела на 4px выше соседних кнопок */ #d-clip,#n-clip{position:relative;overflow:hidden;cursor:pointer;margin:0; display:inline-flex;align-items:center;justify-content:center} /* input внутри скрепки: невидим, но остаётся в потоке — display:none в Telegram WebView глотает событие change */ #d-file,#n-file{position:absolute;inset:0;width:100%;height:100%;opacity:0; cursor:pointer;font-size:0} /* прикреплённые файлы: чипы над строкой ввода, крестик снимает */ .attrow{display:flex;flex-wrap:wrap;gap:6px} .attrow .att{display:flex;align-items:center;gap:6px;max-width:100%; background:var(--card2);border:1px solid var(--line);border-radius:8px; padding:3px 6px 3px 8px;font-size:12px;color:var(--fg)} .attrow .att span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap; max-width:180px} .attrow .att small{color:var(--dim)} .attrow .att b{cursor:pointer;color:var(--dim);font-weight:700;padding:0 2px} .attrow .att.up{opacity:.6} /* спиннер на цветных кнопках: рамка берётся от текста, чтобы не теряться на accent-фоне. Disabled остаётся заметным, но явно не нажимаемым. */ #d-send.sending .spin,#n-go.creating .spin{border-color:currentColor;border-top-color:transparent} #d-send:disabled,#n-go:disabled{opacity:.75;cursor:wait} /* группы по проектам: заголовок с путём, карточки под ним; сворачивание по клику */ .pgroup{margin-bottom:14px} .pgroup.collapsed{margin-bottom:6px} .phead{display:flex;align-items:center;gap:6px;font-size:11px;color:var(--dim); text-transform:uppercase;letter-spacing:.4px;margin:0 2px 6px;font-weight:600; cursor:pointer;user-select:none;padding:3px 4px;border-radius:6px;transition:background .15s ease} .phead:hover{color:var(--fg);background:rgba(255,255,255,.04)} .phead .pchevron{display:inline-flex;align-items:center;justify-content:center;transition:transform .2s ease} .phead .pchevron svg{width:11px;height:11px} .phead .pfolder svg{width:13px;height:13px} .phead .pname{overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .phead .pbadges{margin-left:auto;display:flex;align-items:center;gap:4px} .phead .pcount{background:var(--card2);border-radius:8px;padding:1px 7px;font-size:11px;color:var(--dim)} .pgroup.collapsed .pchevron{transform:rotate(-90deg)} .pgroup.collapsed .card{display:none !important} .card.waits{border-color:var(--q);box-shadow:inset 3px 0 0 var(--q)} .chip.wait{background:var(--q);color:#fff} .waithint{color:var(--fg)!important;opacity:.95;white-space:normal} /* последняя фраза сессии: по ней видно, какая про что, без захода внутрь */ .lastline{white-space:normal;display:-webkit-box;-webkit-line-clamp:2; -webkit-box-orient:vertical;overflow:hidden;margin-top:2px} .sumbox{white-space:pre-wrap;font-size:12.5px;line-height:1.5;color:var(--fg); background:var(--card2);border:1px solid var(--line);border-radius:10px; padding:10px 12px;margin-top:8px} .sumbox .when{color:var(--dim);font-size:11px;display:block;margin-bottom:6px} #att .item.dim{opacity:.55} #att .item[data-att]{cursor:pointer} #att .att-actions{display:flex;justify-content:flex-end;margin-top:8px} #d-rec.rec,#n-rec.rec{color:#fff;background:var(--danger,#e5484d);animation:recdot 1.2s ease-in-out infinite} #d-rec.rec.pause,#n-rec.rec.pause{animation:none;opacity:.6} @keyframes recdot{50%{opacity:.55}} .quick{display:flex;gap:6px;overflow-x:auto;padding-bottom:2px} .quick::-webkit-scrollbar,.tabs::-webkit-scrollbar{display:none} /* раскрытые группы («клавиши», «экран»): своя строка над быстрыми командами */ .keyrow{margin-bottom:6px} .keyrow .ar{padding:6px 11px} .quick [data-row].on{background:var(--accent);color:#fff;border-color:var(--accent)} .quick .btn.on{background:var(--accent);color:#fff;border-color:var(--accent)} /* пауза живого экрана видна на свёрнутой группе — иначе замерший кадр читается как зависшая сессия */ .quick [data-row].warnrow,.quick [data-row].on.warnrow{ background:var(--card2);color:var(--warn);border-color:var(--warn)} /* лента и списки */ .item{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin-bottom:8px} .item .t{font-size:11px;color:var(--dim);display:flex;gap:8px;margin-bottom:4px} .item .x{font-size:13px;white-space:pre-wrap;word-break:break-word} .mono{font-family:var(--mono);font-size:12px} .empty{color:var(--dim);text-align:center;padding:30px 10px;font-size:13px} /* тост */ /* Свои диалоги вместо confirm()/prompt(): Telegram Mini App нативные подавляет — «Всё равно отправить?» молча отменялось, и промпт не уходил (баг 06.08.2026). */ #modal,#stop-modal,#switch-modal,#worker-modal,#info-modal{position:fixed;inset:0;z-index:90;background:#000a;display:flex; align-items:center;justify-content:center;padding:20px;backdrop-filter:blur(3px)} #stop-modal.hidden,#switch-modal.hidden,#worker-modal.hidden,#info-modal.hidden{display:none!important} #modal .mbox,#stop-modal .mbox,#switch-modal .mbox,#worker-modal .mbox,#info-modal .mbox{background:var(--card);border:1px solid var(--line);border-radius:16px; padding:16px;width:min(420px,100%);box-shadow:0 20px 50px rgba(0,0,0,.5)} #worker-modal .mbox{width:min(540px,95%);max-height:calc(100vh - 40px);overflow-y:auto} #modal .mtitle,#stop-modal .mtitle,#switch-modal .mtitle,#worker-modal .mtitle{font-size:14px;line-height:1.4;white-space:pre-wrap;margin-bottom:10px} #switch-modal .switch-body{max-height:60vh;overflow:auto;margin:0 -4px;padding:0 4px} #switch-modal .switch-sec{margin-bottom:12px} #switch-modal .switch-sec:last-child{margin-bottom:0} #switch-modal .switch-h{font-size:11px;color:var(--dim);text-transform:uppercase;letter-spacing:.4px;margin:0 0 6px} #switch-modal .opt.sel{border-color:var(--q)} #switch-modal .switch-body .empty{padding:6px 2px} .switch-cols{display:flex;flex-wrap:wrap;gap:6px} .switch-cols .opt{width:auto;flex:1 1 calc(50% - 6px);margin:0;min-width:120px;text-align:center} /* «О сессии» (TF-117, бывшая вкладка «Сводка»): строки «ключ — значение» в две колонки вместо четырнадцати отдельных карточек. */ #info-modal .mbox{width:min(520px,100%);max-height:calc(100vh - 40px);overflow-y:auto} .info-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:6px} #info-modal .info-head .mtitle{margin:0;font-size:14px} #info .item{display:grid;grid-template-columns:minmax(96px,34%) minmax(0,1fr);gap:8px;align-items:baseline; margin:0;padding:6px 0;border:0;border-bottom:1px solid var(--line);border-radius:0;background:none} #info .item .t{margin:0} #info .item .x{font-size:12.5px} #info .btns .btn{display:inline-flex;align-items:center;gap:5px} #stop-modal .btns .btn{display:inline-flex;align-items:center;gap:5px} .a2tyapmanage{display:flex;flex-direction:column;gap:10px} .a2tyapmanage label{font-size:11px;color:var(--dim);display:flex;flex-direction:column;gap:5px} .a2tyapdeadline{width:100%;font-size:14px} .a2tyapquick,.a2tyapstatus,.a2tyapfoot{display:flex;gap:7px;flex-wrap:wrap} .a2tyapstatus .btn{flex:1;min-width:88px} .a2tyapfoot{justify-content:space-between;border-top:1px solid var(--line);padding-top:10px} .a2tyapstatus .danger{color:#fff;background:var(--danger,#e5484d);border-color:var(--danger,#e5484d)} #toast{position:fixed;left:50%;bottom:calc(78px + var(--sa-bottom));transform:translate(-50%,20px); background:#000d;color:#fff;border-radius:12px;padding:10px 15px;font-size:13px;z-index:60; opacity:0;transition:.22s;pointer-events:none;max-width:92vw;text-align:center} #toast.on{opacity:1;transform:translate(-50%,0)} .spin{display:inline-block;width:13px;height:13px;border:2px solid var(--dim);border-top-color:transparent; border-radius:50%;animation:sp .8s linear infinite;vertical-align:-2px} @keyframes sp{to{transform:rotate(360deg)}} @media (min-width:900px){ :root{--term-fs:13.5px} :root{--page:1180px; --pagepad:20px} .wrap{padding-top:14px} header{padding-top:calc(10px + var(--sa-top))} /* карточки в несколько колонок — на широком экране список в одну колонку превращается в километр пустоты справа */ .cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));align-items:stretch} .cards > .card{display:flex;flex-direction:column} /* Виджет лимитов шире и воздушнее, но не на всю страницу: ячейки растут до comfortable предела. Строки не переносим — при нехватке ширины прокрутка, а не рост в высоту. */ .limits{display:flex;gap:9px;margin:2px 0 12px;flex-wrap:nowrap;width:min(100%,900px);max-width:100%;overflow-x:auto} .lim{flex:1 1 auto;min-width:0;border-radius:var(--radius);padding:7px 10px} .quota-account{flex:1 1 auto;min-width:220px} .quota-group{flex-direction:row;align-items:center;gap:6px} .quota-group-name{font-size:11px} .quota-windows{gap:5px} .quota-window{font-size:10px} .quota-window b,.quota-val{font-size:11.5px} .quota-resets{font-size:10.5px} .quota-group{padding:3px 0} .money-compact{gap:4px} .system-compact{gap:4px} .quota-block-title{font-size:10.5px} .lim .t{font-size:11px;margin-bottom:3px} .lim .v{font-size:19px} .limrow+.limrow{margin-top:8px;padding-top:8px} .limmeta{grid-template-columns:minmax(0,1fr) auto;gap:2px 8px;font-size:11px} .limmeta b{font-size:15px} .limmeta .reset{font-size:9.5px} .limrow.compact+.limrow.compact{margin-top:4px;padding-top:4px} .limrow.compact .limmeta{grid-template-columns:minmax(0,1fr) auto;gap:2px 8px} .limrow.compact .limmeta b{font-size:15px} .limval.dual b{font-size:12.5px} .lim .sub{font-size:11px;margin-top:8px} .bar{height:5px;margin-top:8px} nav{z-index:50;justify-content:center;gap:40px} nav button{flex:0 0 120px} /* На десктопе деталь оставляет список видимым, но не активным: отдельный слой размывает его и закрывает сессию по клику. Нижняя навигация выше обоих слоёв и не попадает под blur. */ #detail-backdrop{display:block;position:fixed; inset:0 0 calc(var(--nav-h) + var(--sa-bottom));z-index:35; background:rgba(3,5,8,.48);backdrop-filter:blur(7px); -webkit-backdrop-filter:blur(7px);opacity:0;visibility:hidden; pointer-events:none;transition:opacity .22s ease,visibility .22s ease} #detail-backdrop.open{opacity:1;visibility:visible;pointer-events:auto} #detail{left:auto;bottom:calc(var(--nav-h) + var(--sa-bottom)); width:min(860px,72vw);border-left:1px solid var(--line); box-shadow:-24px 0 60px rgba(0,0,0,.45)} } @media (max-width:899px){ /* Телефон: лимиты уходят на отдельную строку под заголовком сессии, но остаются над вкладками. Строку не переносим: у agy недельное окно уже скрыто проекцией, остальное при нехватке ширины прокручивается по горизонтали, а не растёт в высоту. */ .dhead{flex-wrap:wrap;row-gap:7px} .dhead-limits{order:5;flex:1 0 100%;gap:6px;flex-wrap:nowrap;overflow-x:auto; scrollbar-width:none;-ms-overflow-style:none} .dhead-limits::-webkit-scrollbar{display:none} .dhead-limits .dlim-win{flex:0 0 auto;padding:1px 7px;gap:4px} .dhead-limits .dlim-bar{width:30px} .dhead-limits .dlim-reset{font-size:8.5px} .dhead-limits .dlim-gname{font-size:9px} /* Чип профиля Codex — первым в строке лимитов: иначе он уезжает вправо под горизонтальную прокрутку и на телефоне не виден. Раскрытое меню — на всю ширину строки, чтобы не растягивать её по горизонтали. */ .d-profile-actions{order:-1} .d-profile-actions[open]{flex:1 0 100%} .dhead-limits:has(.d-profile-actions[open]){flex-wrap:wrap} } @media (min-width:1500px){ #detail{width:min(1040px,62vw)} :root{--page:1500px; --term-fs:14.5px} } /* capture-pane is a terminal, not page text. Page theme previously made default foreground and inverse SGR unreadable, especially OpenCode menus. */ #term { color:#eeeeec; background:#101217; color-scheme:dark; } #term::selection, #term *::selection { color:#101217; background:#cdd6f4; } /* Compact quota matrix: only window and percentage are visible; reset stays in tooltip. */ .quota-account{min-width:0} .quota-title{display:flex;align-items:center;justify-content:space-between;gap:4px;margin-bottom:3px} .quota-title .limname{font-size:11px;font-weight:650;color:var(--fg)} .quota-title small,.quota-note{font-size:9px;color:var(--dim)} .quota-col-header{font-size:9.5px;color:var(--dim);font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap} .quota-title-left{display:inline-flex;align-items:center;gap:6px} .btn-touch-limits{background:transparent;border:1px solid var(--line);color:var(--dim);border-radius:5px;width:19px;height:19px;padding:0;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:all .15s ease} .btn-touch-limits:hover{color:var(--accent);border-color:var(--accent);background:rgba(255,255,255,.06)} .btn-touch-limits.busy{pointer-events:none;opacity:.6;animation:sp .8s linear infinite} .btn-touch-limits .ic{width:11px;height:11px;stroke-width:2} .limits-modal-head .btn-touch-limits{width:auto;height:24px;padding:0 8px;gap:4px;font-size:11px;font-weight:600;border-radius:6px} .limits-modal-head .btn-touch-limits .ic{width:12px;height:12px} .quota-stale{border-style:dashed} .quota-stale .quota-title small{color:var(--warn)} .quota-block{margin-top:2px} .quota-block-title{font-size:10px;font-weight:700;color:var(--fg);padding:2px 0 1px 0} .quota-block+.quota-block .quota-block-title{border-top:1px solid var(--line);margin-top:3px;padding-top:3px} .quota-group{display:flex;gap:4px;align-items:center;justify-content:flex-start;padding:2px 0;border-top:1px solid var(--line)} .quota-block-title+.quota-group{border-top:none} .quota-group-name{flex:0 1 auto;min-width:48px;font-size:10px;line-height:1.2;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:inline-flex;align-items:center;gap:4px} .quota-group-name .chip{font-size:9.5px;padding:1px 6px;border-radius:5px;line-height:1.3;max-width:100%;overflow:hidden;text-overflow:ellipsis} .quota-values{flex:0 0 auto;margin-left:auto;display:flex;align-items:baseline;justify-content:flex-end;gap:2px;min-width:0} /* Десктоп: время/дата сброса — слева после имени, значения — справа. */ .quota-resets{flex:0 0 auto;display:flex;align-items:baseline;gap:2px 8px;font-size:9.5px;color:var(--dim);font-variant-numeric:tabular-nums;white-space:nowrap} .quota-reset-bit b{color:var(--fg);font-weight:600} .quota-val{text-align:right;font-size:11px;font-variant-numeric:tabular-nums;font-weight:600} .quota-val.warning{color:var(--warn)} .quota-val.critical{color:var(--bad)} .quota-val.unknown{color:var(--dim)} .quota-sep{color:var(--dim);font-size:10px;opacity:0.6;padding:0 1px} .quota-windows{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:3px;min-width:0;flex:1} .quota-window{display:flex;align-items:baseline;justify-content:space-between;gap:3px;min-width:0;font-size:9px;line-height:1.1} .quota-window span{color:var(--dim)} .quota-window b{text-align:right;font-size:11px;font-variant-numeric:tabular-nums} .quota-window.warning b{color:var(--warn)} .quota-window.critical b{color:var(--bad)} .quota-window.unknown b{color:var(--dim)} .quota-note{margin:2px 0;overflow-wrap:anywhere} .flow-toggle{display:flex;gap:7px;align-items:center;flex-wrap:wrap;color:var(--fg);font-size:13px;cursor:pointer} .flow-toggle input{width:17px;height:17px;margin:0;accent-color:var(--accent)} .flow-toggle small{flex-basis:100%;font-size:11px;color:var(--dim)} .flow-toggle.compact{flex:0 0 auto;white-space:nowrap;font-size:12px;margin:0;padding:4px 8px;border:1px solid var(--line);border-radius:8px} .prompt-queue{border:1px solid var(--warn);background:var(--card);border-radius:9px;padding:8px 12px;margin:8px 12px;min-width:0} .queue-heading{display:flex;justify-content:space-between;gap:8px;font-size:12px} .queue-heading strong{color:var(--warn)} .queue-heading small,.queue-reason{color:var(--dim);font-size:10px} .queue-preview{font-size:12px;white-space:pre-wrap;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin:3px 0} .queue-actions{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px;font-size:11px} .queue-actions details{min-width:0} .queue-actions details[open]{flex-basis:100%} .queue-actions pre{white-space:pre-wrap;overflow-wrap:anywhere;max-height:150px;overflow:auto;font-family:var(--mono);font-size:11px;margin:4px 0} .queue-actions summary{cursor:pointer;color:var(--dim)} body.light .quota-window.warning b,body.light .quota-val.warning,body.light .quota-stale .quota-title small,body.light .queue-heading strong{color:#925200} body.light .quota-window.critical b,body.light .quota-val.critical{color:#b42332} .quota-account[data-open-limits="1"]{cursor:pointer;transition:border-color .15s ease} .quota-account[data-open-limits="1"]:hover{border-color:var(--accent)} #limits-modal{position:fixed;inset:0;z-index:75;background:rgba(0,0,0,.6);display:flex;align-items:center;justify-content:center;padding:16px;backdrop-filter:blur(4px)} #limits-modal.hidden{display:none!important} .limits-mbox{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px 16px;width:min(540px,100%);max-height:86vh;display:flex;flex-direction:column;box-shadow:0 20px 50px rgba(0,0,0,.5);overflow:hidden} .limits-modal-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px;padding-bottom:8px;border-bottom:1px solid var(--line)} .limits-modal-head h3{font-size:15px;font-weight:700;margin:0;color:var(--fg)} .limits-close-btn{background:transparent;border:1px solid var(--line);color:var(--dim);border-radius:7px;width:26px;height:26px;padding:0;display:inline-flex;align-items:center;justify-content:center;font-size:13px;cursor:pointer;line-height:1} .limits-close-btn:hover{color:var(--fg);border-color:var(--fg)} .limits-modal-body{overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;gap:10px;padding-right:2px} .limits-modal-body::-webkit-scrollbar{width:5px} .limits-modal-body::-webkit-scrollbar-thumb{background:var(--line);border-radius:3px} .fl-sec{display:flex;flex-direction:column} .fl-sec-title{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.4px;color:var(--accent);padding:6px 0 3px;border-bottom:1px solid var(--line)} .fl-sec:first-child .fl-sec-title{padding-top:0} .fl-item{padding:7px 0;border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:3px} .fl-item:last-child{border-bottom:none} .fl-item-head{display:flex;align-items:center;justify-content:space-between;gap:8px} .fl-name{font-size:12.5px;font-weight:600;color:var(--fg);display:inline-flex;align-items:center} .fl-name .chip{font-size:11px;padding:2px 7px;border-radius:6px;line-height:1.3} .fl-resets{font-size:10px;color:var(--dim);background:var(--line);padding:1px 5px;border-radius:4px} .fl-resets b{color:var(--accent)} .fl-wins{display:flex;flex-direction:column;gap:3px;margin-top:1px} .fl-win{display:flex;align-items:center;flex-wrap:wrap;gap:4px 7px;font-size:11px;padding:1px 0} .fl-win-lbl{font-size:10.5px;font-weight:600;color:var(--dim);min-width:44px} .fl-win-val{font-size:11.5px;font-weight:700;font-variant-numeric:tabular-nums;min-width:32px;text-align:right} .fl-win-val.normal{color:var(--fg)} .fl-win-val.warning{color:var(--warn)} .fl-win-val.critical{color:var(--bad)} .fl-win-val.unknown{color:var(--dim)} .fl-win-kind{font-size:9.5px;color:var(--dim);margin-right:2px} .fl-bar-bg{width:50px;height:4px;border-radius:2px;background:rgba(255,255,255,.08);overflow:hidden;flex-shrink:0} .fl-bar{height:100%;border-radius:2px;transition:width .2s ease} .fl-bar.normal{background:var(--accent)} .fl-bar.warning{background:var(--warn)} .fl-bar.critical{background:var(--bad)} .fl-win-reset{font-size:10.5px;color:var(--dim);margin-left:auto;white-space:nowrap} .fl-win-reset strong{color:var(--fg);font-weight:600} .fl-win-reset small{color:var(--dim);margin-left:3px} @media(max-width:480px){ .fl-win{justify-content:flex-start} .fl-win-reset{flex-basis:100%;margin-left:0;font-size:9.5px;padding-left:44px} } body.light .fl-bar-bg{background:rgba(0,0,0,.08)} body.light .fl-win-val.warning{color:#925200} body.light .fl-win-val.critical{color:#b42332} .fl-stale-warn{display:flex;align-items:center;gap:5px;font-size:10.5px;color:var(--warn,#f5a623);background:rgba(245,166,35,.08);border:1px solid rgba(245,166,35,.2);border-radius:6px;padding:3px 8px;margin:2px 0} .fl-stale-ic{font-size:11px;flex-shrink:0} .fl-no-data{font-size:11px;color:var(--dim);font-style:italic;padding:2px 0} body.light .fl-stale-warn{color:#925200;background:rgba(146,82,0,.08);border-color:rgba(146,82,0,.2)} #workers{min-width:0;overflow-x:hidden} #workers .cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr));gap:10px;padding:12px} #workers .worker-card{min-width:0;box-sizing:border-box;padding:14px;border:1px solid var(--line);border-radius:14px;cursor:pointer} #workers .worker-card.busy{border-color:color-mix(in srgb,var(--warn) 48%,var(--line))} #workers .worker-card.idle{border-color:color-mix(in srgb,var(--ok) 30%,var(--line))} .worker-card-head{display:grid;gap:9px;min-width:0} .worker-title{display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0} .worker-title strong{font-size:15px;overflow-wrap:anywhere} .worker-state{flex:none;max-width:50%;padding:4px 8px;border-radius:999px;font-size:11px;font-weight:650;background:var(--card2);color:var(--dim)} .worker-state.busy{background:color-mix(in srgb,var(--warn) 18%,var(--card));color:var(--warn)} .worker-state.idle{background:color-mix(in srgb,var(--ok) 13%,var(--card));color:var(--ok)} .worker-tags{display:flex;align-items:center;flex-wrap:wrap;gap:5px;min-width:0} .worker-tag{max-width:100%;box-sizing:border-box;padding:3px 7px;border:1px solid var(--line);border-radius:7px; background:var(--card2);color:var(--fg);font-size:11px;line-height:1.25;overflow-wrap:anywhere} .worker-tag.harness{border-color:color-mix(in srgb,var(--accent) 35%,var(--line));background:color-mix(in srgb,var(--accent) 12%,var(--card2));color:var(--accent);font-weight:650} .worker-tag.role{color:var(--fg);font-weight:600} .worker-tag.level,.worker-tag.effort{color:var(--dim)} .worker-tag.model{font-family:var(--mono);font-size:10px} .worker-profile-row{display:flex;flex-wrap:wrap;gap:6px 14px;color:var(--dim);font-size:11px;overflow-wrap:anywhere} .worker-profile-row b{color:var(--dim);font-weight:550;margin-right:3px} .worker-capabilities{min-width:0;overflow-wrap:anywhere} .worker-capabilities .badge{display:inline-block;margin:0 3px 2px 0!important} .worker-metrics{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 6px} .worker-metric{display:grid;gap:3px;min-width:90px;padding:7px 9px;border:1px solid var(--line);border-radius:9px;background:var(--card2)} .worker-metric span{color:var(--dim);font-size:10px} .worker-metric strong{font-size:12px;font-weight:650;overflow-wrap:anywhere} .worker-last{margin:8px 0;max-height:64px;overflow:hidden;color:var(--fg);font-size:13px;line-height:1.45;overflow-wrap:anywhere} .worker-card-actions{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:8px} /* Вкладка «Орки» (TF-117): сводная строка, «ещё» и «подробности» карточки, свёрнутые блоки внизу, место под сообщения лидов (TF-114). */ .orcs-summary{padding:10px 12px 0;color:var(--dim);font-size:12px} .orcs-slot{margin:0 12px 10px} .orcs-slot.hidden{display:none} #workers .worker-title .bw-paused{margin-left:auto} #workers .worker-title .bw-paused+.worker-state{margin-left:0} #workers .worker-metrics{margin:8px 0 0} /* «ещё» раскрывается в той же строке кнопок (переносится при нехватке места), а не выпадающим меню: карточка обрезает всё, что за её краем. */ .orc-more[open]{display:flex;flex-wrap:wrap;align-items:center;gap:5px} .orc-more>summary{list-style:none;cursor:pointer} .orc-more>summary::-webkit-details-marker{display:none} .orc-more[open]>summary{opacity:.7} .orc-more-menu{display:flex;flex-wrap:wrap;gap:5px} .orc-details{margin-top:8px} .orc-details>summary{width:max-content;cursor:pointer;color:var(--dim);font-size:11px} .orc-details[open]>summary{margin-bottom:6px} .orc-details .worker-profile-row+.worker-profile-row{margin-top:4px} .orcs-fold{margin:4px 12px 10px;padding:8px 10px;border:1px solid var(--line);border-radius:10px;background:var(--card2)} .orcs-fold>summary{cursor:pointer;font-size:13px;font-weight:600} .orcs-fold>summary span,.orcs-sub span{color:var(--dim);font-size:12px;font-weight:400} .orcs-fold[open]>summary{margin-bottom:6px} .orcs-sub{margin:12px 0 6px;font-size:12.5px;font-weight:600} #board-leads .orcs-fold{margin-top:0} .worker-journal{min-width:0;margin:10px 0 4px;padding:10px;border:1px solid var(--line);border-radius:11px;background:var(--card2)} .worker-parent-journal{margin:4px 12px 10px} .worker-journal>summary{display:flex;align-items:center;gap:8px;min-width:0;cursor:pointer;list-style:none;font-size:12px;font-weight:650} .worker-journal>summary::-webkit-details-marker{display:none} .worker-journal>summary::after{content:'▸';flex:none;color:var(--dim);transition:transform .15s ease} .worker-journal[open]>summary::after{transform:rotate(90deg)} .worker-journal-title{flex:none;white-space:nowrap} .worker-journal-preview{min-width:0;overflow:hidden;color:var(--dim);font-size:11px;font-weight:400;text-overflow:ellipsis;white-space:nowrap} .worker-journal>summary:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:3px} .worker-journal-events{max-height:260px;overflow:auto;overscroll-behavior:contain} .worker-event{display:grid;grid-template-columns:22px minmax(0,1fr);gap:7px;padding:8px 0;border-top:1px solid var(--line);min-width:0} .worker-event-icon{display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--line);color:var(--dim);font-size:11px;font-weight:700} .worker-event.ok .worker-event-icon{background:color-mix(in srgb,var(--ok) 17%,var(--card));color:var(--ok)} .worker-event.bad .worker-event-icon{background:color-mix(in srgb,var(--bad) 16%,var(--card));color:var(--bad)} .worker-event-body{min-width:0} .worker-event-meta{display:flex;flex-wrap:wrap;gap:3px 7px;align-items:center;color:var(--dim);font-size:10px} .worker-event-kind,.worker-event-status{padding:1px 5px;border-radius:5px;background:var(--line);color:var(--dim)} .worker-event.ok .worker-event-status{color:var(--ok)} .worker-event.bad .worker-event-status{color:var(--bad)} .worker-event-summary{margin-top:3px;color:var(--fg);font-size:12px;line-height:1.4;overflow-wrap:anywhere} .worker-event-details{margin-top:4px;color:var(--dim);font-size:10px} .worker-event-details summary{cursor:pointer;width:max-content;max-width:100%} .worker-event-details pre{max-height:200px;overflow:auto;margin:5px 0 0;padding:7px;border-radius:7px;background:var(--bg);color:var(--fg);font:10px/1.4 var(--mono);white-space:pre-wrap;overflow-wrap:anywhere} .worker-table-wrap{width:100%;min-width:0} .wh-table{table-layout:fixed;overflow-wrap:anywhere} .wh-table th,.wh-table td{padding:6px!important;vertical-align:top} .wh-table td{border-top:1px solid var(--line)} @media(max-width:520px){ #workers .cards{grid-template-columns:minmax(0,1fr);padding:6px 10px!important;gap:7px} #workers .worker-card{padding:8px 10px;border-radius:10px} .worker-card-head{gap:4px} .worker-title strong{font-size:13.5px} .worker-state{padding:2px 6px;font-size:10px;font-weight:600} .worker-tags{gap:3px} .worker-tag{padding:1px 5px;border-radius:5px;font-size:10px;line-height:1.2} .worker-tag.model{font-size:9.5px} .worker-profile-row{gap:2px 8px;font-size:10px;line-height:1.25} .worker-capabilities .badge{margin:0 2px 0 0!important;padding:1px 4px!important;font-size:9px!important;border-radius:3px} #workers .worker-metrics{display:flex;flex-direction:row;align-items:center;flex-wrap:wrap;gap:2px 6px;margin:4px 0;padding:3px 6px;background:var(--card2);border:1px solid var(--line);border-radius:6px;font-size:10.5px;line-height:1.25} #workers .worker-metric{display:inline-flex;align-items:baseline;gap:3px;min-width:0;padding:0;border:0;background:transparent;white-space:nowrap;flex:none} #workers .worker-metric span{font-size:9.5px;color:var(--dim);font-weight:500} #workers .worker-metric strong{font-size:10.5px;font-weight:600} #workers .worker-metric:not(:last-child)::after{content:'·';margin-left:5px;color:var(--dim);opacity:0.6} .worker-last{margin:4px 0;max-height:34px;font-size:12px;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden} .worker-card-actions{margin-top:5px;gap:5px} .orcs-summary{padding:8px 10px 0} .orcs-slot{margin:0 10px 8px} .orcs-fold{margin:4px 10px 8px;padding:6px 8px} .orcs-fold>summary{font-size:12.5px} .orc-details{margin-top:5px} .board-lead-row{padding:6px 8px} .worker-card-actions .btn{padding:2px 8px;font-size:11px;height:24px;line-height:20px} .worker-journal{margin:4px 0 2px;padding:6px 8px;border-radius:8px} .worker-parent-journal{margin:4px 10px 8px!important} .worker-journal>summary{gap:5px;font-size:11px} .worker-journal-preview{font-size:10px} .worker-journal-events{max-height:160px} .worker-event{grid-template-columns:16px minmax(0,1fr);gap:5px;padding:4px 0} .worker-event-icon{width:16px;height:16px;font-size:9px} .worker-event-meta{gap:2px 4px;font-size:9px;line-height:1.2} .worker-event-kind,.worker-event-status{padding:0 3px;border-radius:3px;font-size:9px} .worker-event-summary{margin-top:1px;font-size:11px;line-height:1.25} .worker-event-details{margin-top:2px;font-size:9px} .worker-event-details pre{margin:3px 0 0;padding:4px 6px;font:9px/1.3 var(--mono);max-height:140px} .worker-table-wrap{overflow:visible} .wh-table,.wh-table tbody{display:block;width:100%} .wh-table thead{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0} .wh-table tr{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:6px 8px;padding:6px 4px;border-top:1px solid var(--line)} .wh-table td{display:flex;flex-direction:column;gap:2px;min-width:0;padding:0!important;border:0!important;white-space:normal!important;text-align:left!important;font-size:11px} .wh-table td::before{content:attr(data-label);color:var(--dim);font-size:9.5px} } /* --- Доска: общая лента задачи ------------------------------------------- */ #board{min-width:0;overflow-x:hidden;padding:0 12px 12px} .global-leads{font-size:12px} .global-leads[open]{display:grid;gap:5px} .global-lead-row{display:grid;grid-template-columns:minmax(80px,auto) minmax(0,1fr);gap:2px 8px;align-items:baseline;padding-top:5px;border-top:1px solid var(--line)} .global-lead-row span,.global-lead-row small{min-width:0;overflow-wrap:anywhere;color:var(--dim)} .global-lead-row small{grid-column:1/-1;font-size:10px} .board-messages{display:grid;gap:6px;margin:0 0 10px;padding:8px 10px;border:1px solid var(--line);border-radius:10px;background:var(--card2)} .board-messages>header{display:flex;align-items:center;gap:8px;min-width:0;font-size:12px} .board-message-unread-count,.board-message-unread{padding:1px 6px;border-radius:8px;background:color-mix(in srgb,var(--warn) 20%,transparent);color:var(--warn);font-size:10px;font-weight:600} .board-messages>header .btn{margin-left:auto} .board-message-filters{display:flex;gap:5px;flex-wrap:wrap} .board-message-feed{display:grid;gap:5px;max-height:300px;overflow:auto} .board-message{min-width:0;padding:6px 8px;border:1px solid var(--line);border-radius:8px;background:var(--card)} .board-message.unread{border-left:3px solid var(--warn)} .board-message-meta{display:flex;align-items:center;gap:6px;color:var(--dim);font-size:10px} .board-message-meta time{margin-left:auto} .board-message-text{margin-top:3px;overflow-wrap:anywhere;white-space:pre-wrap;font-size:12px} .bw-name{min-width:0;overflow:hidden;font-size:13px;font-weight:650;text-overflow:ellipsis;white-space:nowrap;color:var(--bh,var(--fg))} .bw-state{margin-left:auto;flex:none;padding:1px 6px;border-radius:9px;background:var(--card);color:var(--dim);font-size:10px} .bw-state.busy{color:var(--warn)} .bw-paused{flex:none;padding:1px 6px;border-radius:9px;background:color-mix(in srgb,var(--warn) 22%,transparent);color:var(--warn);font-size:10px} .board-lead-row{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;margin:4px 0 8px;padding:7px 10px;border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:10px;background:var(--card2)} .board-lead-row .bw-name{color:var(--accent)} .board-lead-row .bw-state{margin-left:0} .board-lead-row .board-ibar{margin:0 0 0 auto} .bw-line{overflow:hidden;color:var(--dim);font-size:10.5px;text-overflow:ellipsis;white-space:nowrap} .board-ibar{display:flex;flex-wrap:wrap;gap:5px} .board-ibar .btn{padding:2px 8px;font-size:11px;height:24px;line-height:20px} .board-filters{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 10px} .board-filter{padding:3px 10px;border:1px solid var(--line);border-radius:14px;background:var(--card2);color:var(--dim);font-size:12px;cursor:pointer} .board-filter.on{border-color:var(--accent);color:var(--fg);background:color-mix(in srgb,var(--accent) 16%,transparent)} .board-feed{display:grid;gap:7px;min-width:0} .board-empty{padding:30px 16px;color:var(--dim);text-align:center} .board-event{display:grid;grid-template-columns:22px minmax(0,1fr);gap:8px;min-width:0;padding:8px 10px;border:1px solid var(--line);border-left:3px solid var(--bh,var(--line));border-radius:10px;background:var(--card)} .board-event.lead{border-left-color:var(--accent)} .board-event.sergey{border-left-color:var(--q);background:color-mix(in srgb,var(--q) 8%,var(--card))} .board-event.system{opacity:.85} .board-event-ic{display:flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:6px;background:var(--card2);color:var(--bh,var(--dim));font-size:12px} .board-event.sergey .board-event-ic{color:var(--q)} .board-event-meta{display:flex;flex-wrap:wrap;align-items:center;gap:4px 7px;color:var(--dim);font-size:10.5px} .board-actor{padding:0 6px;border-radius:8px;background:var(--card2);font-weight:600} .board-actor.lead{color:var(--accent)} .board-actor.sergey{color:var(--q)} .board-actor.worker{color:var(--bh,var(--accent))} .board-status{padding:0 5px;border-radius:7px;background:var(--card2);color:var(--dim)} .board-event-title{margin-top:3px;font-size:13px;font-weight:600;overflow-wrap:anywhere} .board-event-text{margin-top:2px;color:var(--fg);font-size:12px;line-height:1.4;white-space:pre-wrap;overflow-wrap:anywhere} .board-refs{margin-top:4px;color:var(--dim);font-size:10px} .board-refs summary{cursor:pointer} .board-refs pre{max-height:160px;overflow:auto;margin:4px 0 0;padding:6px;border-radius:6px;background:var(--bg);color:var(--fg);font:10px/1.4 var(--mono);white-space:pre-wrap} .hue-0{--bh:#63b3ff}.hue-1{--bh:#3ddc84}.hue-2{--bh:#ffb454}.hue-3{--bh:#c78bff}.hue-4{--bh:#ff8fa3}.hue-5{--bh:#4dd6d6} @media(max-width:520px){ #board{padding:0 10px 10px} .board-ibar .btn{padding:2px 7px;font-size:10.5px;height:23px;line-height:19px} .board-event{padding:6px 8px;grid-template-columns:18px minmax(0,1fr);gap:6px} .board-event-ic{width:18px;height:18px;font-size:11px} .board-event-title{font-size:12.5px} .board-event-text{font-size:11.5px} }