
*{box-sizing:border-box}
/* Здесь стояло сокращение font: с Inter — шрифта, которого в расширении нет,
   поэтому браузер подставлял системный. Сокращение перебивало объявление из
   токенов, и Manrope не доезжал. Семейство теперь одно и задаётся в токенах. */
html,body{margin:0;min-width:320px;min-height:100%;background:var(--bg);color:var(--text);font-size:14px;line-height:1.48}
body{position:relative;isolation:isolate;background:
  radial-gradient(540px 280px at 110% -4%,color-mix(in srgb,var(--accent) 17%,transparent),transparent 68%),
  radial-gradient(420px 280px at -12% 26%,color-mix(in srgb,var(--accent-3) 9%,transparent),transparent 70%),
  linear-gradient(180deg,var(--bg) 0%,var(--bg-2) 100%);background-attachment:fixed}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.18;background-image:linear-gradient(rgba(125,125,160,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(125,125,160,.09) 1px,transparent 1px);background-size:28px 28px;mask-image:linear-gradient(to bottom,black,transparent 65%)}
button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{opacity:.48;cursor:not-allowed;filter:saturate(.55)}.logo{position:relative;display:grid;place-items:center;width:40px;height:40px;border-radius:var(--radius);color:var(--ink-on-accent);font-size:20px;font-weight:850;flex:0 0 auto;background:linear-gradient(145deg,var(--card) 0%,var(--bg-2) 55%,var(--accent-3) 115%);color:var(--text);border:1px solid rgba(17,24,39,.10);box-shadow:0 10px 26px rgba(58,61,64,.10),inset 0 1px 0 rgba(255,255,255,.24);text-shadow:none}
.logo::before{content:"";position:absolute;inset:1px;border-radius:var(--radius);border:1px solid rgba(255,255,255,.18);pointer-events:none}.brand{font-weight:850;font-size:15px;letter-spacing:-.015em}.panel{display:none}.panel.active{display:block}.card{position:relative;overflow:hidden;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:14px;margin-bottom:10px;box-shadow:var(--shadow);backdrop-filter:blur(18px)}.card::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}.status-card{background:linear-gradient(145deg,color-mix(in srgb,var(--card-solid) 96%,transparent),color-mix(in srgb,var(--accent-soft) 48%,var(--card-solid)))}.accent-card{background:radial-gradient(280px 130px at 100% 0,color-mix(in srgb,var(--accent) 15%,transparent),transparent 72%),linear-gradient(155deg,var(--card),color-mix(in srgb,var(--accent-soft) 72%,var(--card)));border-color:color-mix(in srgb,var(--accent) 22%,var(--line));box-shadow:var(--shadow-strong)}.session-card{border-color:color-mix(in srgb,var(--good) 30%,var(--line));background:linear-gradient(145deg,var(--card),color-mix(in srgb,var(--good) 8%,var(--card)))}.plan-card{border-color:color-mix(in srgb,var(--accent) 30%,var(--line));background:linear-gradient(160deg,var(--card),color-mix(in srgb,var(--accent) 6%,var(--card)))}.progress-card{border-color:color-mix(in srgb,var(--accent-2) 28%,var(--line))}.task-card{background:linear-gradient(180deg,var(--card),color-mix(in srgb,var(--accent-soft) 24%,var(--card)))}
.row{display:flex;align-items:center}.col{display:flex;flex-direction:column}.between{justify-content:space-between}.gap{gap:8px}.wrap{flex-wrap:wrap}.grow{flex:1}.min0{min-width:0}.top4{margin-top:4px}.top6{margin-top:6px}.top8{margin-top:8px}.top10{margin-top:10px}.top12{margin-top:12px}.top14{margin-top:14px}.hidden{display:none!important}.strong{font-weight:780;letter-spacing:-.01em}.label{display:block;font-size:var(--fs-13);letter-spacing:-.005em;color:var(--muted);font-weight:700;margin-bottom:8px}.muted{color:var(--muted)}.small{font-size:13px}.ellipsis{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.wide{width:100%}
.pill{display:inline-flex;align-items:center;padding:4px 7px;border-radius:var(--radius-badge);background:color-mix(in srgb,var(--warn) 10%,var(--card-solid));color:var(--warn);font-size:12px;white-space:nowrap;border:0}.pill.subtle{background:color-mix(in srgb,var(--text) 5%,transparent);color:var(--muted)}
button{position:relative;border:1px solid var(--line);background:var(--control);color:var(--text);border-radius:var(--radius);padding:9px 11px;transition:transform .14s ease,border-color .14s ease,box-shadow .14s ease,background .14s ease}button:hover{transform:translateY(-1px);border-color:color-mix(in srgb,var(--accent) 24%,var(--line));background:var(--control-hover);box-shadow:0 7px 16px rgba(15,23,42,.06)}button:active{transform:translateY(0)}.primary{overflow:hidden;background:linear-gradient(135deg,var(--accent),var(--accent-2));color:var(--ink-on-accent);border-color:transparent;font-weight:760;box-shadow:0 8px 22px color-mix(in srgb,var(--accent) 28%,transparent)}.primary::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 10%,rgba(255,255,255,.13) 44%,transparent 68%);transform:translateX(-115%);transition:transform .4s ease}.primary:hover{background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 90%,var(--card)),var(--accent-2));box-shadow:0 11px 28px color-mix(in srgb,var(--accent) 34%,transparent)}.primary:hover::after{transform:translateX(115%)}.ghost{background:color-mix(in srgb,var(--control) 78%,transparent)}.compact{padding:7px 9px;font-size:13px}.icon-btn{width:38px;height:38px;min-height:38px;padding:0;display:grid;place-items:center;font-size:20px;border-radius:var(--radius)}.danger{color:var(--bad)}
input,select,textarea{width:100%;border:1px solid var(--line);border-radius:var(--radius);background:var(--control);color:var(--text);padding:10px 11px;outline:none;transition:border-color .14s ease,box-shadow .14s ease,background .14s ease}textarea{resize:vertical;min-height:118px;line-height:1.55}input::placeholder,textarea::placeholder{color:color-mix(in srgb,var(--muted) 72%,transparent)}input:focus,select:focus,textarea:focus{border-color:color-mix(in srgb,var(--accent) 52%,var(--line));box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 12%,transparent),0 8px 22px rgba(26,33,53,.05);background:var(--card-solid)}select{appearance:auto}
.workflow-strip{display:grid;grid-template-columns:auto 1fr auto 1fr auto 1fr auto;gap:4px;align-items:center;padding:9px 8px;margin:-2px 0 13px;border-radius:var(--radius);border:1px solid var(--line);background:color-mix(in srgb,var(--text) 3%,transparent)}.workflow-step{display:flex;align-items:center;gap:4px;color:var(--muted);min-width:0}.workflow-step span{display:grid;place-items:center;width:20px;height:20px;border-radius:var(--radius-xs);background:color-mix(in srgb,var(--text) 7%,transparent);font-size:13px;font-weight:900}.workflow-step b{font-size:13px;white-space:nowrap}.workflow-step.active{color:var(--text)}.workflow-step.active span{background:linear-gradient(135deg,var(--accent),var(--accent-2));color:var(--ink-on-accent);box-shadow:0 5px 14px color-mix(in srgb,var(--accent) 22%,transparent)}.workflow-line{height:1px;background:linear-gradient(90deg,color-mix(in srgb,var(--accent) 38%,var(--line)),var(--line));min-width:8px}
.quick-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-bottom:10px}.quick{min-height:45px;text-align:left;font-weight:690;background:linear-gradient(155deg,var(--control),color-mix(in srgb,var(--accent-soft) 20%,var(--control)));padding-left:12px}.quick::before{content:"";position:absolute;left:0;top:9px;bottom:9px;width:2px;border-radius:var(--radius-pill);background:linear-gradient(var(--accent),var(--accent-3));opacity:.7}.context-options{display:flex;flex-wrap:wrap;gap:6px 12px}.check{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--muted)}.check input{width:auto;margin:0;accent-color:var(--accent)}
.suggestion-list{display:flex;flex-direction:column;gap:6px}.suggestion{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;padding:9px 10px;background:color-mix(in srgb,var(--card-solid) 70%,transparent);border:1px solid var(--line);border-radius:var(--radius)}.suggestion-text{font-size:13px}.suggestion button{flex:0 0 auto;padding:5px 8px;font-size:13px}
.chips{display:flex;flex-wrap:wrap;gap:6px}.chip{padding:5px 8px;border-radius:var(--radius-badge);background:color-mix(in srgb,var(--accent) 7%,var(--card-solid));border:1px solid color-mix(in srgb,var(--accent) 14%,var(--line));font-size:12px;color:color-mix(in srgb,var(--text) 86%,var(--accent))}.plan-list{margin:7px 0 0;padding-left:20px}.plan-list li{margin:5px 0}.plan-intel{display:grid;grid-template-columns:1fr 1fr;gap:8px}.intel-box{padding:10px;border-radius:var(--radius);background:color-mix(in srgb,var(--text) 3.5%,transparent);border:1px solid var(--line);min-width:0}.intel-box b{display:block;margin-top:4px;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stage-list{display:flex;flex-direction:column;gap:6px}.stage{display:grid;grid-template-columns:24px 1fr auto;gap:8px;align-items:center;padding:9px 10px;border-radius:var(--radius);background:color-mix(in srgb,var(--text) 3%,transparent);border:1px solid var(--line)}.stage-dot{width:19px;height:19px;border-radius:var(--radius-xs);display:grid;place-items:center;font-size:12px;background:color-mix(in srgb,var(--text) 8%,transparent);color:var(--muted)}.stage.active{background:linear-gradient(90deg,color-mix(in srgb,var(--accent) 10%,transparent),color-mix(in srgb,var(--accent-2) 5%,transparent));border-color:color-mix(in srgb,var(--accent) 28%,var(--line))}.stage.active .stage-dot{background:linear-gradient(135deg,var(--accent),var(--accent-2));color:var(--ink-on-accent);box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 10%,transparent)}.stage.done .stage-dot{background:color-mix(in srgb,var(--good) 15%,transparent);color:var(--good)}.stage.error{background:color-mix(in srgb,var(--bad) 8%,transparent);border-color:color-mix(in srgb,var(--bad) 25%,var(--line))}.stage.error .stage-dot{background:color-mix(in srgb,var(--bad) 15%,transparent);color:var(--bad)}.stage-note{font-size:13px;color:var(--muted)}.progress-log{max-height:132px;overflow:auto;border-top:1px dashed var(--line);padding-top:8px;color:var(--muted);font-size:13px;white-space:pre-wrap}
.answer{white-space:pre-wrap;overflow-wrap:anywhere;margin-top:12px;line-height:1.58}.stats-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.stat{padding:10px;background:linear-gradient(145deg,color-mix(in srgb,var(--text) 3%,transparent),color-mix(in srgb,var(--accent) 4%,transparent));border-radius:var(--radius);border:1px solid var(--line);min-width:0}.stat b{display:block;font-size:15px;overflow:hidden;text-overflow:ellipsis;letter-spacing:-.03em}.stat span{font-size:13px;color:var(--muted);letter-spacing:0}
.export-card{background:radial-gradient(260px 160px at 100% 0,color-mix(in srgb,var(--accent-2) 11%,transparent),transparent 72%),var(--card)}.export-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.notice{padding:10px 11px;border-radius:var(--radius);background:color-mix(in srgb,var(--text) 3.5%,transparent);color:var(--muted);font-size:13px;border:1px solid var(--line)}.format-legend{display:grid;grid-template-columns:1fr 1fr;gap:6px}.format-legend span{padding:7px 8px;border-radius:var(--radius-xs);background:color-mix(in srgb,var(--text) 2.6%,transparent);border:1px solid var(--line);font-size:13px;color:var(--muted)}.format-legend b{color:var(--accent);letter-spacing:.05em}.search-row,.secret-row{display:grid;grid-template-columns:1fr auto;gap:8px}.preview{max-height:360px;overflow:auto;margin:0;padding:11px;border-radius:var(--radius);background:var(--preview);color:var(--preview-text);font:12px/1.5 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;white-space:pre-wrap;overflow-wrap:anywhere;border:1px solid rgba(255,255,255,.06);box-shadow:inset 0 1px 16px rgba(0,0,0,.18)}
.item-list{display:flex;flex-direction:column;gap:8px;max-height:360px;overflow:auto}.item{padding:9px;border:1px solid var(--line);border-radius:var(--radius);background:color-mix(in srgb,var(--card-solid) 76%,transparent)}.item a{font-weight:700;color:var(--accent-2);text-decoration:none}.item-text{margin-top:4px;color:var(--muted);font-size:13px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.tab-list{display:flex;flex-direction:column;gap:8px}.browser-tab{display:grid;grid-template-columns:auto 1fr;gap:8px;align-items:start;background:var(--card);border:1px solid var(--line);padding:11px;border-radius:var(--radius);box-shadow:var(--shadow)}.browser-tab input{width:auto;margin-top:3px;accent-color:var(--accent)}.tab-title{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tab-url{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}/* Здесь стоял --soft (2.55:1): это подпись состояния страницы, её читают. */
.tab-badge{font-size:12px;color:var(--muted);margin-top:4px}
.history-list{display:flex;flex-direction:column;gap:8px}.history-item{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:12px;box-shadow:var(--shadow)}.history-item:hover{border-color:color-mix(in srgb,var(--accent) 22%,var(--line))}.history-head{display:flex;justify-content:space-between;gap:8px}.history-task{font-weight:760}.history-meta{font-size:12px;color:var(--muted);margin-top:4px}.history-preview{font-size:13px;color:var(--muted);margin-top:8px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.history-actions{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
footer{display:flex;justify-content:space-between;gap:8px;padding:11px 14px 16px;color:var(--soft);font-size:12px;letter-spacing:.015em}.footer-brand{font-weight:750;letter-spacing:.06em;color:color-mix(in srgb,var(--muted) 82%,var(--accent))}
/* Полоса прокрутки (ТЗ 13.09.2026, п. 11). Была 8 px с бегунком в сером;
   владелец: «не нравится, как выглядит». Делаем тише и аккуратнее: дорожка
   шире, сам бегунок — 4 px из цвета границ, под курсором заметнее. Прятать
   её совсем до наведения нельзя: полоса ещё и показывает, сколько осталось
   прокрутить. */
::-webkit-scrollbar{width:12px;height:12px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--muted) 26%,transparent);border:4px solid transparent;background-clip:padding-box;border-radius:var(--radius-pill)}::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb,var(--muted) 45%,transparent);border:3px solid transparent;background-clip:padding-box}::-webkit-scrollbar-corner{background:transparent}
@media(max-width:390px){.quick-grid,.export-grid,.plan-intel{grid-template-columns:1fr}.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.workflow-step b{display:none}.workflow-strip{grid-template-columns:auto 1fr auto 1fr auto 1fr auto}.format-legend{grid-template-columns:1fr}.logo{width:37px;height:37px}}
@media(max-width:420px){#composerCtx{padding-left:8px;padding-right:6px}#composerModelName{max-width:132px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
body{display:grid;grid-template-columns:72px minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) auto;min-height:100vh;background:linear-gradient(180deg,var(--bg) 0%,var(--bg-2) 100%)}
body::before{opacity:.10;background-image:linear-gradient(rgba(23,28,39,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(23,28,39,.06) 1px,transparent 1px);background-size:32px 32px;mask-image:linear-gradient(to bottom,black,transparent 70%)}footer{grid-column:1/-1;grid-row:3;border-top:1px solid var(--line);background:var(--bg);padding:8px 16px 9px 88px;font-size:12px;letter-spacing:0}.footer-brand{color:var(--muted);font-weight:400;letter-spacing:0}
.section-hero{min-height:142px;display:flex;justify-content:space-between;align-items:center;gap:16px;margin:0 0 14px;padding:20px 22px;border-bottom:1px solid var(--line);background:transparent;overflow:hidden}.section-hero>div{min-width:0;max-width:620px}.section-hero img{width:178px;height:128px;object-fit:contain;opacity:.98;flex:0 0 auto}.section-index{font-size:12px;line-height:1;letter-spacing:0;color:var(--muted);font-weight:760;margin-bottom:9px}.section-hero h1{margin:0;color:var(--text);font:400 clamp(28px,6vw,43px)/1 inherit;letter-spacing:.06em}.section-hero p{margin:10px 0 0;color:var(--muted);font-size:13px;max-width:540px}.compact-hero{min-height:110px;padding-top:11px;padding-bottom:14px}.compact-hero h1{font-size:26px}.compact-hero img{width:130px;height:95px}
.panel{animation:omegaReveal .18s ease}.panel.active{display:block}@keyframes omegaReveal{from{opacity:.4;transform:translateY(3px)}to{opacity:1;transform:none}}
.card{border-radius:var(--radius);padding:14px 15px;margin-bottom:10px;border:1px solid var(--line);background:var(--card-solid);box-shadow:var(--shadow);backdrop-filter:none}.card::after{display:none}.card:hover{border-color:color-mix(in srgb,var(--text) 14%,var(--line))}.status-card,.task-card,.accent-card,.session-card,.plan-card,.progress-card,.export-card{background:var(--card-solid)}.accent-card{border-left:3px solid var(--accent);box-shadow:var(--shadow)}.plan-card{border-top:3px solid var(--accent)}.progress-card{border-top:3px solid color-mix(in srgb,var(--accent) 78%,var(--card))}.session-card{border-left:3px solid var(--good)}
.strong{font-weight:720;letter-spacing:-.012em}.small{font-size:13px}.pill{border:1px solid var(--line);background:var(--card);color:var(--muted);padding:4px 7px;border-radius:var(--radius-badge)}.pill.subtle{background:var(--bg-2);color:var(--muted)}
button{border-radius:var(--radius-xs);padding:8px 11px;background:var(--card);border-color:var(--line);box-shadow:none;font-weight:620}.primary{background:var(--btn);color:var(--ink-on-accent);border-color:var(--accent);box-shadow:none;font-weight:780}.primary::after{display:none}.primary:hover{background:var(--accent-soft);border-color:var(--bg-2);box-shadow:0 8px 20px rgba(58,61,64,.08)}.ghost{background:var(--card)}.icon-btn{border-radius:var(--radius-xs)}
input,select,textarea{border-radius:var(--radius-xs);padding:9px 10px;background:var(--card);border-color:var(--line);box-shadow:none}textarea{min-height:112px}.preview{border-radius:var(--radius-xs);box-shadow:none}.quick-grid{gap:6px}.quick{min-height:42px;border-radius:var(--radius-xs);background:var(--card);border-color:var(--line);font-weight:650}.quick::before{background:var(--accent);top:8px;bottom:8px;width:2px}.quick:hover{background:var(--omega-travertine-wash)}
.workflow-strip{border-radius:var(--radius-xs);background:var(--card);border-color:var(--line);padding:10px}.workflow-step span{border-radius:var(--radius-circle);width:21px;height:21px;background:var(--card);border:1px solid var(--line);font-size:13px}.workflow-step.active span{background:var(--btn);color:var(--ink-on-accent);box-shadow:none;border-color:var(--bg-2)}.workflow-line{background:var(--line)}
.check{font-size:13px}.check input{accent-color:var(--line)}.suggestion{border-radius:var(--radius-xs);background:var(--card)}.chip{border-radius:var(--radius-xs);background:var(--good-soft);border-color:var(--line);color:var(--text);padding:5px 7px}.intel-box,.stat,.format-legend span{border-radius:var(--radius-xs);background:var(--card);border-color:var(--line)}
.stage{border-radius:var(--radius-xs);background:var(--card)}.stage-dot{border-radius:var(--radius-circle);background:var(--card);border:1px solid var(--line)}.stage.active{background:var(--omega-travertine-wash);border-color:var(--bg-2)}.stage.active .stage-dot{background:var(--btn);color:var(--ink-on-accent);box-shadow:none}.stage.done .stage-dot{background:var(--good-soft);border-color:var(--good-fill)}.stats-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.stat{padding:11px}.stat b{font:400 20px/1.05 inherit;letter-spacing:.02em}.stat span{font-size:13px;letter-spacing:.10em}.export-grid{gap:8px}.format-legend b{color:var(--text)}.item,.browser-tab,.history-item{border-radius:var(--radius-xs);background:var(--card);box-shadow:none}.item a{color:var(--text);text-decoration:underline;text-decoration-color:var(--accent);text-underline-offset:3px}.history-item{position:relative}.history-item::before{content:"";position:absolute;left:-1px;top:10px;bottom:10px;width:2px;background:var(--accent);border-radius:var(--radius-xs)}.history-task{font-weight:720}.search-row,.secret-row{gap:6px}
.card>.strong:first-child,.card .row>.strong:first-child{font-size:13px}
@media(min-width:860px){.card{padding:16px 17px}.quick-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:560px){body{display:block;padding-bottom:64px}.section-hero{min-height:98px;padding:9px 7px 12px;margin-bottom:9px}.section-hero h1{font-size:26px}.section-hero p{font-size:13px}.section-hero img{width:92px;height:78px}.compact-hero img{width:78px;height:65px}.compact-hero h1{font-size:26px}footer{display:none}.quick-grid,.export-grid,.plan-intel{grid-template-columns:1fr}.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.workflow-step b{display:none}.workflow-strip{grid-template-columns:auto 1fr auto 1fr auto 1fr auto}.format-legend{grid-template-columns:1fr 1fr}.card{border-radius:var(--radius);padding:12px}}
@media(max-width:360px){.section-hero img{display:none}.section-hero>div{max-width:none}.format-legend{grid-template-columns:1fr}}
body{background:linear-gradient(180deg,var(--bg-2) 0%,var(--bg-2) 100%)}
body::before{display:none}.site-state .pill{overflow:hidden;text-overflow:ellipsis}.card{border-radius:var(--radius-xs);padding:12px 13px;margin-bottom:8px;box-shadow:none}.card:hover{border-color:var(--line-strong)}
.section-hero{min-height:104px;padding:11px 13px 12px;margin-bottom:8px}.section-hero h1{font-size:26px;letter-spacing:.035em}.section-hero p{margin-top:6px;font-size:13px}.section-hero img{width:115px;height:88px}.compact-hero{min-height:88px}.compact-hero h1{font-size:26px}.compact-hero img{width:92px;height:70px}
.strong{font-weight:730}.small{font-size:13px}
button{white-space:nowrap}.compact{padding:7px 9px}.primary{background:var(--accent-3);border-color:var(--bg-2)}.primary:hover{background:var(--bg-2)}
.quick-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.quick{min-height:38px;padding:7px 9px;font-size:13px;text-align:left}
.workflow-strip{padding:7px 8px;margin-bottom:10px}.workflow-step{gap:4px}.workflow-step span{width:19px;height:19px}.workflow-step b{font-size:13px}.workflow-line{height:1px}
textarea{min-height:92px;max-height:190px}.context-options{gap:4px 8px}.check{font-size:13px}.check input{width:14px;height:14px}
.suggestion-list{display:flex;flex-wrap:wrap;gap:6px}.suggestion{display:inline-flex;align-items:center;gap:6px;padding:6px 7px;border:1px solid var(--line);background:var(--good-soft);border-radius:var(--radius-xs);min-width:0}.suggestion-text{font-size:13px;line-height:1.25}.suggestion .ghost{padding:5px 7px;font-size:13px}
.plan-card{border-top:2px solid var(--accent)}.plan-columns .chips{gap:4px}.chip{font-size:12px;padding:4px 6px}.plan-intel{gap:6px}.intel-box{padding:8px}.intel-box b{font-size:13px}
.plan-details{border:1px solid var(--line);border-radius:var(--radius-xs);padding:0;background:var(--card)}.plan-details summary{cursor:pointer;padding:8px 9px;font-size:13px;font-weight:700;color:var(--text);list-style:none}.plan-details summary::-webkit-details-marker{display:none}.plan-details summary::after{content:"＋";float:right;color:var(--muted)}.plan-details[open] summary::after{content:"−"}.plan-details[open]>*:not(summary){margin-left:8px;margin-right:8px;margin-bottom:8px}
.plan-list{font-size:13px;line-height:1.45;padding-left:20px}.plan-list li{margin:3px 0}
.stage-list{gap:4px}.stage{padding:8px 9px}.stage-title{font-size:13px}.stage-note{font-size:13px}.progress-log{max-height:145px;font-size:13px}
.stats-grid{gap:6px}.stat{padding:9px 10px;min-height:62px}.stat b{font-size:20px}.stat span{font-size:13px}.result-stats{grid-template-columns:repeat(4,minmax(0,1fr))}
.answer{font:400 15px/1.48 inherit;color:var(--text);margin-top:10px}.quality-strip{display:flex;flex-wrap:wrap;gap:4px}.quality-strip span{border:1px solid var(--line);background:var(--card);border-radius:var(--radius-xs);padding:5px 7px;font-size:12px;color:var(--muted)}.quality-strip b{color:var(--text)}
.result-warnings{margin-top:8px;padding:8px 9px;border-left:2px solid var(--warn);background:var(--warn-soft);border-radius:0 var(--radius-xs) var(--radius-xs) 0;font-size:13px;color:var(--text)}
.result-preview{border-top:1px solid var(--line);padding-top:10px}.mini-table-wrap{max-width:100%;overflow:auto;border:1px solid var(--line);border-radius:var(--radius-xs);background:var(--card)}.mini-table{border-collapse:collapse;min-width:520px;width:100%;font-size:13px}.mini-table th{position:sticky;top:0;text-align:left;background:var(--accent-soft);padding:7px;border-bottom:1px solid var(--line);color:var(--text);white-space:nowrap}.mini-table td{padding:7px;border-bottom:1px solid var(--line);border-right:1px solid var(--line);vertical-align:top;max-width:180px}.mini-table tr:last-child td{border-bottom:0}.mini-table-more{padding:6px 7px;color:var(--muted);font-size:12px;background:var(--card)}.result-download{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px}.result-download select{min-width:0}
.scan-intelligence{padding:8px 9px;border:1px solid var(--line);border-left:2px solid var(--accent);border-radius:var(--radius-xs);background:var(--card)}.scan-intelligence b{display:block;margin-top:2px;font-size:13px}.technical-card{padding:0;overflow:hidden}.technical-card>summary{cursor:pointer;padding:11px 13px;list-style:none}.technical-card>summary::-webkit-details-marker{display:none}.technical-card>summary::after{content:"＋";float:right;color:var(--muted)}.technical-card[open]>summary::after{content:"−"}.technical-card[open]>.muted,.technical-card[open]>.preview{margin-left:12px;margin-right:12px}.technical-card[open]>.preview{margin-bottom:12px}.preview{max-height:320px;font-size:13px}
.export-card{border-top:2px solid var(--accent)}.format-legend{gap:4px}.format-legend span{padding:6px 7px;font-size:13px}.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.history-preview{-webkit-line-clamp:2}.history-actions{gap:4px}.history-actions button{font-size:13px;padding:6px 8px}
.browser-tab{padding:9px}.tab-title{font-size:13px}.tab-url{font-size:12px}

@media(max-width:560px){
  body{padding-bottom:58px}.site-state .pill{font-size:12px}.card{padding:10px 11px;margin-bottom:7px}.section-hero{min-height:auto;padding:7px 7px 9px;margin-bottom:6px}.section-hero img{display:none}.section-index{font-size:12px;margin-bottom:5px}.section-hero h1{font-size:26px;letter-spacing:.025em}.section-hero p{font-size:13px;margin-top:5px}.compact-hero h1{font-size:20px}
  .quick-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.quick{font-size:13px;min-height:36px}.export-grid{grid-template-columns:1fr}.plan-intel{grid-template-columns:1fr 1fr}.stats-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.result-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.format-legend{grid-template-columns:repeat(2,minmax(0,1fr))}.settings-grid{grid-template-columns:1fr 1fr}
  .row.between.gap{gap:6px}.row.between.gap>button{flex:0 0 auto}.answer{font-size:13px}.suggestion-list{display:block}.suggestion{display:flex;margin-top:5px}.suggestion:first-child{margin-top:0}.suggestion-text{flex:1}
}
@media(max-width:380px){.quick-grid,.settings-grid,.plan-intel{grid-template-columns:1fr}.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.result-download{grid-template-columns:1fr}.format-legend{grid-template-columns:1fr 1fr}.workflow-step b{display:none}
}

/* v2.7 — progressive disclosure */
.progress-log-wrap{border:1px solid var(--line);border-radius:var(--radius-xs);background:var(--card);overflow:hidden}
.progress-log-wrap>summary{cursor:pointer;list-style:none;padding:8px 10px;font-size:13px;font-weight:700;letter-spacing:.04em;color:var(--muted);display:flex;align-items:center;justify-content:space-between}
.progress-log-wrap>summary::-webkit-details-marker{display:none}.progress-log-wrap>summary:after{content:'+';font-size:13px;font-weight:500}.progress-log-wrap[open]>summary:after{content:'−'}
.progress-log-wrap .progress-log{margin:0;border-top:1px solid var(--line);border-radius:0;max-height:180px;background:var(--card)}
html,body{max-width:100%;overflow-x:hidden}.mini-table-wrap,.preview{overscroll-behavior-inline:contain}
.ai-chip{background:var(--accent-soft)!important;border-color:var(--bg-2)!important}.ai-chip::before{content:'ИИ';font-size:12px;font-weight:900;letter-spacing:.08em;color:var(--muted);margin-right:3px}.evidence-chip{border-left:2px solid var(--accent)!important}.mini-table th.ai-col{background:var(--accent-soft);color:var(--muted);border-bottom-color:var(--bg-2)}
body{background:linear-gradient(180deg,var(--bg-2) 0%,var(--bg) 52%,var(--bg-2) 100%)}
.logo{background:linear-gradient(145deg,var(--card) 0%,var(--bg) 58%,var(--accent-3) 115%);box-shadow:0 10px 26px rgba(58,61,64,.08)}
.primary{background:var(--cta)!important;color:var(--cta-text)!important;border-color:var(--cta)!important;box-shadow:0 7px 18px rgba(58,61,64,.12)!important}
.primary:hover{background:var(--cta-hover)!important;border-color:var(--cta-hover)!important;box-shadow:0 10px 22px rgba(58,61,64,.16)!important}
.primary::after{background:linear-gradient(110deg,transparent 10%,rgba(255,255,255,.09) 44%,transparent 68%)}
button:hover{border-color:var(--accent-3);box-shadow:0 5px 14px rgba(58,61,64,.06)}
input:focus,select:focus,textarea:focus{border-color:var(--accent-3);box-shadow:0 0 0 3px rgba(189,182,170,.18)}
.accent-card,.plan-card,.progress-card,.export-card{border-color:var(--accent-2);box-shadow:none;background:linear-gradient(155deg,var(--card),var(--bg-2))}
.plan-card,.export-card{border-top:2px solid var(--accent-3)}
.scan-intelligence{border-left-color:var(--accent-3);background:var(--bg-2)}
.mini-table th{background:var(--bg-2);border-bottom-color:var(--bg-2);color:var(--text)}
.mini-table th.ai-col{background:var(--bg-2);color:var(--text);border-bottom-color:var(--line)}
.ai-chip{background:var(--bg-2)!important;border-color:var(--bg-2)!important}.ai-chip::before{color:var(--muted)}
.evidence-chip{border-left-color:var(--line)!important}
.progress-log-wrap,.plan-details,.quality-strip span,.suggestion{background:var(--bg-2)}
.result-warnings{background:var(--bg-2);border-left-color:var(--warn)}

/* Trust layer */
.result-trust{border:1px solid var(--line);background:linear-gradient(180deg,var(--bg),var(--bg-2));border-radius:var(--radius-xs);padding:9px}
.trust-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.trust-item{min-width:0;border:1px solid var(--line);border-radius:var(--radius-xs);background:rgba(255,255,255,.68);padding:8px}
.trust-item b{display:block;font:500 15px/1.15 inherit;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.trust-item span{display:block;margin-top:3px;font-size:13px;letter-spacing:0;color:var(--soft)}
.trust-item.is-good{border-color:var(--good-fill)}.trust-item.is-warn{border-color:var(--warn-fill)}
.next-actions{margin-top:9px;border-top:1px solid var(--line);padding-top:9px}.next-actions-list{display:flex;flex-wrap:wrap;gap:4px}.next-action{font-size:13px;padding:5px 7px;border:1px solid var(--line);border-radius:var(--radius-xs);background:var(--bg-2);color:var(--text)}

/* Evidence Ledger filters */
.history-tools{display:grid;grid-template-columns:minmax(0,1fr) 138px;gap:6px;padding:9px}.history-tools input,.history-tools select{padding:8px 9px;font-size:13px}
.history-status{display:inline-flex;align-items:center;gap:4px;margin-left:6px;padding:2px 5px;border-radius:var(--radius-badge);border:1px solid var(--line);font-size:13px;letter-spacing:0;color:var(--muted);background:var(--bg-2)}.history-status.verified{border-color:var(--good-fill);color:var(--text)}.history-status.review{border-color:var(--warn-fill);color:var(--text)}.history-status.empty{color:var(--muted)}

/* Human-first copy: architecture labels remain secondary */
.section-index{color:var(--text)}.section-hero h1{color:var(--text)}.section-hero p{color:var(--text)}
/* Номер активного шага: заливка --accent под мелким текстом давала 4.35. */
.workflow-step.active span{background:var(--btn)!important;color:var(--ink-on-accent)!important;border-color:var(--btn)!important}
.workflow-line{background:var(--bg-2)!important}

@media(max-width:560px){.trust-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.history-tools{grid-template-columns:1fr}}
.stage.active{background:var(--accent-soft)!important;border-color:var(--bg-2)!important}.stage.active .stage-dot{background:var(--bg-2)!important;color:var(--text)!important;border-color:var(--bg-2)!important}
.history-item::before{background:var(--bg-2)!important}.item a{text-decoration-color:var(--line)!important}.quick::before{background:var(--bg-2)!important}.quick:hover{background:var(--accent-soft)!important}


/* Vkladka DEEP SCAN · v2.7 */
.deep-scan-card{border-top:2px solid var(--line);background:linear-gradient(180deg,var(--card),var(--bg))}
.deep-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.deep-plan{border:1px solid var(--line);border-radius:var(--radius-xs);padding:10px;background:var(--bg-2)}
.deep-plan-head{display:flex;justify-content:space-between;align-items:flex-start;gap:8px}.deep-plan-head b{display:block;margin-top:2px;font-size:13px}
.deep-url-list{max-height:180px;overflow:auto;padding:6px 8px 9px}.deep-url-item{padding:6px 0;border-bottom:1px solid var(--line);font-size:13px}.deep-url-item:last-child{border-bottom:0}.deep-url-item b{display:block;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.deep-url-item span{display:block;color:var(--muted);word-break:break-all}
.deep-progress{border:1px solid var(--line);border-radius:var(--radius-xs);padding:10px;background:var(--card)}.deep-progress-track{height:7px;background:var(--bg-2);border-radius:var(--radius-pill);overflow:hidden}.deep-progress-bar{height:100%;width:0;background:linear-gradient(90deg,var(--muted),var(--text));border-radius:inherit;transition:width .2s ease}.deep-result{padding:10px;border:1px solid var(--line);border-left:3px solid var(--muted);border-radius:var(--radius-xs);background:var(--bg-2);font-size:13px}.deep-result b{display:block;margin-bottom:3px}.deep-log-line{padding:2px 0}.deep-blocked{border-color:var(--warn-fill)!important;background:var(--warn-soft)!important}
@media(max-width:560px){.deep-grid{grid-template-columns:1fr 1fr}.deep-scan-card .row.between{align-items:flex-start}}
@media(max-width:380px){.deep-grid{grid-template-columns:1fr}}

/* Vkladka INTERACTION ENGINE · v2.9 · Durable Scale foundation */
.scale-health{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;padding:8px;border:1px solid var(--line);border-radius:var(--radius-xs);background:var(--card)}
.scale-health>div{min-width:0;padding:6px 7px;border-left:2px solid var(--accent);background:var(--card);border-radius:var(--radius-xs)}
.scale-health b{display:block;margin-top:3px;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--text)}
.deep-scan-card{border-top:2px solid var(--accent)}
.deep-progress-bar{background:linear-gradient(90deg,var(--accent-2),var(--accent-3))!important}
@media(max-width:430px){.scale-health{grid-template-columns:repeat(2,minmax(0,1fr))}}


/* Vkladka Interaction Engine · v2.9 */
.interaction-card{border-top:2px solid var(--accent);background:linear-gradient(180deg,var(--card),color-mix(in srgb,var(--accent-soft) 30%,var(--card)))}
.interaction-grid{display:grid;grid-template-columns:1.3fr .8fr .8fr;gap:6px}
.interaction-plan{border:1px solid var(--line);border-radius:var(--radius-xs);overflow:hidden;background:var(--card-solid)}
.interaction-item{display:grid;grid-template-columns:auto 1fr auto;gap:8px;align-items:start;padding:8px 9px;border-bottom:1px solid var(--line)}
.interaction-item:last-child{border-bottom:0}.interaction-item input{width:15px;height:15px;margin-top:2px}.interaction-item b{display:block;font-size:13px}.interaction-item span{display:block;font-size:13px;color:var(--muted);line-height:1.35;margin-top:2px}.interaction-level{font-size:12px!important;letter-spacing:0;padding:3px 5px;border-radius:var(--radius-pill);border:1px solid var(--line);white-space:nowrap}.interaction-level.green{background:var(--bg-2);color:var(--text)}.interaction-level.yellow{background:var(--warn-soft);color:var(--text)}.interaction-level.red{background:var(--bad-soft);color:var(--text)}.interaction-item.red{opacity:.72}.interaction-item.green input{visibility:hidden}
@media(max-width:560px){.interaction-grid{grid-template-columns:1fr}.interaction-item{grid-template-columns:auto 1fr}.interaction-level{grid-column:2;justify-self:start}}

/* =========================================================
   Vkladka v2.9.1 · Mission Guidance / Background Mode clarity
   ========================================================= */
.mission-help{border:1px solid var(--line);border-radius:var(--radius-xs);background:color-mix(in srgb,var(--card-solid) 76%,var(--bg));overflow:hidden}
.mission-help>summary{cursor:pointer;list-style:none;padding:9px 10px;font-size:13px;font-weight:760;color:var(--text)}
.mission-help>summary::-webkit-details-marker{display:none}.mission-help>summary::after{content:"＋";float:right;color:var(--muted)}.mission-help[open]>summary::after{content:"−"}
.mission-help-body{padding:0 10px 10px;font-size:13px;line-height:1.48;color:var(--muted)}
.mission-help-body p{margin:7px 0}.mission-help-body b{color:var(--text)}
.help-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.help-grid>div{padding:8px;border:1px solid var(--line);border-radius:var(--radius-xs);background:var(--card-solid)}.help-grid b{display:block;color:var(--text);font-size:13px;margin-bottom:3px}.help-grid span{display:block;font-size:13px;line-height:1.4}
.mission-rule{margin-top:7px;padding:8px 9px;border-left:2px solid var(--muted);background:var(--bg);border-radius:0 var(--radius-xs) var(--radius-xs) 0;color:var(--text)}
.mission-guidance{border:1px solid var(--line);border-left:3px solid var(--muted);border-radius:var(--radius-xs);background:linear-gradient(145deg,var(--bg-2),var(--accent-soft));padding:10px 11px;color:var(--text)}
html[data-theme="dark"] .mission-guidance{background:linear-gradient(145deg,var(--bg-2),var(--card));border-color:var(--text);color:var(--muted)}
.mission-guidance-head{display:flex;justify-content:space-between;align-items:center;gap:8px}.mission-guidance-head>div{display:flex;align-items:center;gap:8px;min-width:0}.mission-guidance-head b{display:block;font-size:13px}.mission-guidance-dot{width:9px;height:9px;border-radius:var(--radius-circle);background:var(--muted);box-shadow:0 0 0 3px rgba(110,103,96,.12);flex:0 0 auto}.mission-guidance-dot.running{background:var(--accent)}.mission-guidance-dot.paused{background:var(--warn-fill)}.mission-guidance-dot.blocked{background:var(--bad-fill)}.mission-guidance-dot.done{background:var(--good-fill)}
.mission-guidance-text{font-size:13px;line-height:1.45;color:var(--muted)}
.mission-guidance-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px}.mission-guidance-grid>div{min-width:0;padding:7px 8px;border:1px solid var(--line);border-radius:var(--radius-xs);background:color-mix(in srgb,var(--card-solid) 82%,transparent)}.mission-guidance-grid span{display:block;font-size:13px;letter-spacing:0;color:var(--soft);font-weight:800}.mission-guidance-grid b{display:block;margin-top:2px;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mission-do-dont{display:grid;grid-template-columns:1fr 1fr;gap:4px}.mission-do-dont>div{padding:7px 8px;border-radius:var(--radius-xs);font-size:13px;line-height:1.35}.mission-do-dont b{display:block;font-size:13px;letter-spacing:0;margin-bottom:2px}.mission-can{background:var(--bg-2);border:1px solid var(--line)}.mission-caution{background:var(--bg-2);border:1px solid var(--line)}.mission-can b{color:var(--text)}.mission-caution b{color:var(--text)}
html[data-theme="dark"] .mission-can,html[data-theme="dark"] .mission-caution{background:var(--bg-2);border-color:var(--text)}
.mission-explain{border-top:1px solid var(--line);padding-top:7px}.mission-explain>summary{cursor:pointer;list-style:none;font-size:13px;font-weight:700;color:var(--text)}.mission-explain>summary::-webkit-details-marker{display:none}.mission-explain>summary::after{content:"＋";float:right}.mission-explain[open]>summary::after{content:"−"}.mission-explain-body{padding-top:4px;color:var(--muted);font-size:13px;line-height:1.45}.mission-explain-body p{margin:6px 0}.mission-explain-body b{color:var(--text)}
.interaction-target-guide{border:1px solid var(--line);border-radius:var(--radius-xs);background:var(--bg-2);padding:9px 10px}.interaction-target-guide b{display:block;max-width:310px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.interaction-target-url{font:12px/1.35 ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.interaction-target-guide.locked{border-left:3px solid var(--muted)}.interaction-target-guide.running{border-left:3px solid var(--text)}.interaction-target-guide.invalid{border-left:3px solid var(--bad);background:var(--bad-soft)}
html[data-theme="dark"] .interaction-target-guide{background:var(--bg-2);border-color:var(--text)}
@media(max-width:560px){.help-grid,.mission-guidance-grid,.mission-do-dont{grid-template-columns:minmax(0,1fr)}.mission-guidance-head{align-items:flex-start}.mission-guidance-head>.pill{max-width:46%;white-space:normal;text-align:center}.interaction-target-guide b{max-width:220px}}

/* =========================================================
   Vkladka MISSION OS CORE
   ========================================================= */
.mission-os-card{border-top:2px solid var(--muted);background:linear-gradient(180deg,var(--card),var(--bg-2))}
.mission-os-capabilities{display:flex;flex-wrap:wrap;gap:4px}.mission-os-capabilities span{font-size:13px;letter-spacing:.035em;padding:5px 7px;border:1px solid var(--line);border-radius:var(--radius-xs);background:var(--bg-2);color:var(--text)}
.mission-os-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.mission-os-pane{min-width:0;padding:9px;border:1px solid var(--line);border-radius:var(--radius-xs);background:var(--card)}.mission-os-pane b{display:block;font-size:13px;margin-top:2px}.mission-os-details{border:1px solid var(--line);border-radius:var(--radius-xs);background:var(--card);overflow:hidden}.mission-os-details>summary{cursor:pointer;list-style:none;padding:9px 10px;font-size:13px;font-weight:760}.mission-os-details>summary::-webkit-details-marker{display:none}.mission-os-details>summary::after{content:'＋';float:right;color:var(--muted)}.mission-os-details[open]>summary::after{content:'−'}.mission-os-details[open]>.mission-os-grid{padding:0 8px 8px}
.schema-studio{display:flex;flex-direction:column;gap:4px}.schema-row{display:grid;grid-template-columns:minmax(110px,1.4fr) minmax(88px,.8fr) auto auto auto;gap:4px;align-items:center}.schema-row input,.schema-row select{padding:7px 8px;font-size:13px}.schema-row .schema-check{display:flex;align-items:center;justify-content:center;gap:4px;font-size:13px;color:var(--muted);white-space:nowrap}.schema-row .schema-check input{width:13px;height:13px}.schema-remove{padding:0;font-size:15px;line-height:1;width:32px;height:32px;min-width:32px;min-height:32px;display:grid;place-items:center;border-radius:var(--radius-xs)}
.mission-graph{display:flex;flex-wrap:wrap;gap:4px}.mission-node{display:flex;align-items:center;gap:4px;padding:5px 6px;border:1px solid var(--line);border-radius:var(--radius-xs);background:var(--card);font-size:13px}.mission-node::before{content:'';width:6px;height:6px;border-radius:var(--radius-circle);background:var(--bg-2)}.mission-node.done::before{background:var(--muted)}.mission-node.active{border-color:var(--muted);font-weight:760}.mission-node.active::before{background:var(--accent)}.mission-node.paused::before{background:var(--warn-fill)}.mission-node.waiting{opacity:.68}
.mission-os-metric{display:inline-flex;gap:4px;align-items:center;border:1px solid var(--line);border-radius:var(--radius-xs);padding:4px 6px;background:var(--card);font-size:13px}.mission-os-metric b{font-size:13px;display:inline;margin:0}.worker-pane input,.worker-pane select{font-size:13px}
.cell-evidence-table{max-height:260px;overflow:auto;border:1px solid var(--line);border-radius:var(--radius-xs)}.cell-evidence-table table{border-collapse:collapse;width:100%;min-width:620px;font-size:13px}.cell-evidence-table th,.cell-evidence-table td{padding:6px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}.cell-evidence-table th{background:var(--bg-2);position:sticky;top:0}
@media(max-width:560px){.mission-os-grid{grid-template-columns:1fr}.schema-row{grid-template-columns:minmax(100px,1.4fr) minmax(82px,.8fr) auto auto}.schema-row .schema-remove{grid-column:4}.mission-os-capabilities{gap:4px}.mission-os-capabilities span{font-size:13px;padding:4px 5px}}
@media(max-width:380px){.schema-row{grid-template-columns:1fr 1fr}.schema-row .schema-check,.schema-row .schema-remove{justify-self:start}}

/* =========================================================
   Vkladka v4.0 · AUTONOMOUS BROWSER AGENT
   Conversational mission shell + clarification + memory.
   ========================================================= */
.autonomous-agent-card{border-top:2px solid var(--cta);background:linear-gradient(155deg,var(--bg-2) 0%,var(--bg-2) 100%)}
.agent-chat{display:flex;flex-direction:column;gap:6px;max-height:250px;overflow:auto;padding:9px;border:1px solid var(--line);border-radius:var(--radius-xs);background:rgba(255,255,255,.58)}
.agent-controls{display:grid;grid-template-columns:minmax(150px,1.25fr) repeat(3,minmax(110px,1fr));gap:6px;align-items:end}.agent-check{min-height:39px;padding:8px;border:1px solid var(--line);border-radius:var(--radius-xs);background:var(--card);align-items:flex-start}
.agent-subcard,.agent-runtime,.agent-result,.agent-question{padding:12px 13px;border:1px solid var(--line);border-radius:var(--radius);background:var(--card)}
.agent-plan-list{margin:0;padding-left:20px;font-size:13px}.agent-plan-list li{margin:5px 0}.agent-plan-list li b{display:block;color:var(--text)}.agent-plan-list li span{display:block;color:var(--muted);font-size:13px;margin-top:1px}.agent-plan-meta{display:flex;flex-wrap:wrap;gap:4px}.agent-plan-meta span{padding:5px 7px;border:1px solid var(--line);border-radius:var(--radius-xs);background:var(--bg-2);color:var(--muted);font-size:12px}

.agent-activity{max-height:165px;overflow:auto;border:1px solid var(--line);border-radius:var(--radius-xs);background:var(--card)}.agent-activity-item{display:grid;grid-template-columns:55px 70px 1fr;gap:6px;padding:6px 7px;border-bottom:1px solid var(--line);font-size:13px}.agent-activity-item:last-child{border-bottom:0}.agent-activity-item time{color:var(--soft)}.agent-activity-item em{font-style:normal;color:var(--muted);font-weight:700}.agent-activity-item span{color:var(--muted);overflow-wrap:anywhere}
.agent-sources{display:grid;gap:4px}.agent-source{padding:6px 7px;border:1px solid var(--line);border-radius:var(--radius-xs);background:var(--card);font-size:13px}.agent-source b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.agent-source span{display:block;color:var(--muted);overflow-wrap:anywhere}
.agent-memory{border:1px solid var(--line);border-radius:var(--radius-xs);padding:0;background:var(--card)}.agent-memory>summary{cursor:pointer;padding:9px 10px;font-weight:750;font-size:13px;list-style:none}.agent-memory>summary::-webkit-details-marker{display:none}.agent-memory>summary::after{content:'＋';float:right;color:var(--muted)}.agent-memory[open]>summary::after{content:'−'}.agent-memory[open]>*:not(summary){margin-left:9px;margin-right:9px}.agent-memory[open]>*:last-child{margin-bottom:9px}.agent-memory-list{display:grid;gap:4px;max-height:180px;overflow:auto}.agent-memory-item{display:grid;grid-template-columns:1fr auto;gap:6px;padding:7px;border:1px solid var(--line);border-radius:var(--radius-xs);background:var(--card)}.agent-memory-item b{display:block;font-size:13px}.agent-memory-item p{margin:2px 0 0;color:var(--muted);font-size:13px;line-height:1.35}.agent-memory-item button{padding:4px 6px;font-size:13px}.memory-meta{font-size:12px;letter-spacing:0;color:var(--soft)}
#agentQuestionOptions .chip{cursor:pointer}.agent-result .answer{font-size:13px}.agent-result ul{padding-left:18px;margin:6px 0}.agent-result li{font-size:13px;margin:3px 0}
html[data-theme="dark"] .autonomous-agent-card{background:linear-gradient(155deg,var(--card) 0%,var(--bg-2) 100%)}html[data-theme="dark"] .agent-chat,html[data-theme="dark"] .agent-subcard,html[data-theme="dark"] .agent-runtime,html[data-theme="dark"] .agent-result,html[data-theme="dark"] .agent-memory-item{background:var(--card-solid)}html[data-theme="dark"] .agent-check,html[data-theme="dark"] .agent-plan-meta span,html[data-theme="dark"] .agent-activity,html[data-theme="dark"] html[data-theme="dark"] .agent-source,html[data-theme="dark"] .agent-memory{background:var(--bg-2)}
@media(max-width:560px){.agent-controls{grid-template-columns:1fr 1fr}.agent-activity-item{grid-template-columns:46px 60px 1fr}}
@media(max-width:380px){.agent-controls{grid-template-columns:1fr}}
html,body{font-size:13px;line-height:1.5;background:var(--ui-canvas);color:var(--ui-ink)}
body{background:linear-gradient(180deg,var(--bg) 0%,var(--bg-2) 100%)}
body::before{display:none!important}.site-state .pill{border:0;background:transparent;color:var(--text);font-weight:700}
.section-hero{border:0;background:transparent;padding:12px 14px 15px;min-height:112px;margin-bottom:4px}.section-index{color:var(--text);font-weight:800;font-size:12px}.section-hero h1{color:var(--text);font-size:26px;letter-spacing:.015em;line-height:1.06}.section-hero p{color:var(--text);font-size:13px;line-height:1.45;max-width:510px}.section-hero img{filter:saturate(.75);opacity:.95}
.compact-hero h1{font-size:26px}

/* Surfaces and typography */
.card{background:var(--card);border:1px solid var(--ui-border);border-radius:var(--radius);padding:14px 15px;margin-bottom:10px;box-shadow:var(--shadow);overflow:visible}.card:hover{border-color:var(--line)}.card::after{display:none!important}
.strong{color:var(--text);font-weight:760}.soft{color:var(--text)!important}.small{font-size:13px}.label{color:var(--text)!important}.notice{color:var(--text);background:var(--bg-2);border:1px solid var(--ui-border)}
.pill,.pill.subtle{background:var(--accent-soft);color:var(--text);border:1px solid var(--line);font-size:12px;font-weight:700}

/* Controls */
button{min-height:38px;border-radius:var(--radius-xs);border:1px solid var(--ui-border-strong);background:var(--card);color:var(--text);font-size:13px;font-weight:720;box-shadow:none}
button:hover{transform:none;background:var(--bg-2);border-color:var(--muted);box-shadow:none}
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:2px solid var(--tab-active);outline-offset:2px}
.primary{background:var(--ui-cta)!important;color:var(--ink-on-accent)!important;border-color:var(--ui-cta)!important;font-weight:800;box-shadow:0 6px 16px rgba(36,35,33,.14)}
.primary:hover{background:var(--ui-cta-hover)!important;border-color:var(--ui-cta-hover)!important;box-shadow:0 8px 18px rgba(36,35,33,.16)}
/* Выключенная кнопка была бежевой из прежней палитры, и надпись на ней
   читалась с контрастом 1.97. Теперь это обычная выключенная кнопка. */
.primary:disabled{background:var(--bg-2)!important;border-color:var(--line)!important;color:var(--muted)!important}
.ghost{background:var(--card);color:var(--text)}.danger{color:var(--text)!important}
input,select,textarea{border:1px solid var(--line);background:var(--card);color:var(--text);border-radius:var(--radius-xs);padding:10px 11px;font-size:13px;box-shadow:inset 0 1px 0 rgba(0,0,0,.015)}
input::placeholder,textarea::placeholder{color:var(--muted);opacity:1}
input:focus,select:focus,textarea:focus{border-color:var(--muted);box-shadow:0 0 0 3px rgba(130,121,111,.12);background:var(--card)}
textarea{line-height:1.5}
.check{color:var(--text);font-size:13px}.check input{accent-color:var(--text)}

/* Main mission shell */
.status-card{background:var(--card);border-color:var(--line);box-shadow:none;padding-top:10px;padding-bottom:10px}.status-card .label{margin-bottom:2px}.status-card #pageTitle{font-size:12px}.status-card #pageMeta{font-size:12px;color:var(--text)!important}.status-card .icon-btn{min-height:34px;width:34px;height:34px}
.autonomous-agent-card{background:var(--card)!important;border:1px solid var(--line)!important;border-top:3px solid var(--muted)!important;box-shadow:var(--shadow-strong);padding:15px!important}
.agent-card-head{padding-bottom:10px;border-bottom:1px solid var(--line)}.agent-card-title{font-size:15px;margin-top:2px}.agent-head-actions{flex:0 0 auto}.agent-head-actions .pill{background:var(--bg-2);color:var(--muted)}.agent-head-actions button{min-height:32px;padding:6px 9px}
.agent-chat{max-height:260px;padding:11px;background:var(--bg-2);border:1px solid var(--line);border-radius:var(--radius);gap:8px}
#agentChatInput{min-height:104px;font-size:13px;border-width:1.5px;padding:12px 13px}
.agent-options{border:1px solid var(--line);border-radius:var(--radius-xs);background:var(--bg-2);overflow:hidden}.agent-options>summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 11px;color:var(--text);font-size:13px;font-weight:760}.agent-options>summary::-webkit-details-marker{display:none}.agent-options>summary small{color:var(--text);font-size:13px;font-weight:600;text-align:right}.agent-options>summary::after{content:"＋";color:var(--muted);margin-left:auto}.agent-options[open]>summary::after{content:"−"}.agent-options-body{border-top:1px solid var(--line);padding:10px}.agent-controls{grid-template-columns:1fr 1fr!important;gap:6px}.agent-check{background:var(--card)!important;border-color:var(--line)!important;min-height:42px!important;padding:9px!important}.agent-safety-note{margin-top:8px;padding-top:8px;border-top:1px dashed var(--line)}
.agent-submit-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px}.agent-submit-hint{color:var(--text);font-size:13px;line-height:1.35}.agent-send{min-height:43px;padding-left:16px;padding-right:16px;font-size:13px}

/* Mission stages */
/* Полосы слева и бежевые рамки (#D8D0C5, #A66A05, #81796F) — наследие прежнего бренда.
   В эталоне карточки понимания, вариантов, хода и итога выглядят одинаково:
   белая карточка, рамка --line, радиус 14. Различает их заголовок, а не цвет. */
.agent-subcard b,.agent-question>b,.agent-runtime b,.agent-result b{color:var(--text)}.agent-plan-list{font-size:13px;line-height:1.45}.agent-plan-list li{margin:7px 0}.agent-plan-list li span{font-size:13px!important;color:var(--text)!important}.agent-plan-meta span{background:var(--bg-2)!important;color:var(--text)!important;border-color:var(--line)!important;font-size:12px!important}.agent-activity{background:var(--card)!important;border-color:var(--line)!important}.agent-activity-item{font-size:13px!important;border-color:var(--line)!important}.agent-activity-item time{color:var(--muted)!important}.agent-activity-item em{color:var(--text)!important}.agent-activity-item span{color:var(--text)!important}
.agent-source{background:var(--card)!important;border-color:var(--line)!important;font-size:13px!important}.agent-source span{color:var(--text)!important}.agent-result .answer{color:var(--text);font-size:15px!important;line-height:1.55}
.agent-memory{background:var(--bg-2)!important;border-color:var(--line)!important;border-radius:var(--radius-xs)!important}.agent-memory>summary{color:var(--text);font-size:13px!important}.agent-memory-item{border-color:var(--line)!important}.memory-meta{color:var(--text)!important}

/* Progressive disclosure for legacy/manual flow */
.manual-tools-shell{margin:10px 0;border:1px solid var(--line);border-radius:var(--radius);background:var(--bg-2);overflow:hidden;box-shadow:none}.manual-tools-shell>summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;padding:11px 13px;color:var(--text)}.manual-tools-shell>summary::-webkit-details-marker{display:none}.manual-tools-shell>summary>span:first-child{display:flex;flex-direction:column;gap:4px}.manual-tools-shell>summary b{font-size:13px}.manual-tools-shell>summary small{font-size:13px;color:var(--text)}.manual-tools-chevron{font-size:15px;color:var(--muted);transition:transform .18s ease}.manual-tools-shell[open] .manual-tools-chevron{transform:rotate(180deg)}.manual-tools-body{padding:0 10px 10px;border-top:1px solid var(--line)}.manual-tools-body>.card:first-child{margin-top:10px}.manual-tools-body .card{box-shadow:none;background:var(--card)}.manual-tools-body .quick-grid{margin-bottom:9px}

/* General nested systems */
.mission-os-card,.deep-scan-card,.interaction-card,.export-card{box-shadow:var(--shadow);border-color:var(--line)!important}.mission-os-card{background:var(--card)!important;border-top:3px solid var(--muted)!important}.mission-os-pane{background:var(--bg-2)!important;border-color:var(--line)!important}.mission-os-capabilities span{background:var(--bg-2)!important;border-color:var(--line)!important;color:var(--text)!important;font-size:13px!important}.mission-os-details{background:var(--bg-2)!important;border-color:var(--line)!important}.mission-os-details>summary{color:var(--text);font-size:13px!important}.deep-scan-card{background:var(--card)}.interaction-card{background:var(--card)}.interaction-target-guide{background:var(--bg-2)!important;border-color:var(--line)!important}.interaction-target-url{color:var(--text)!important}.progress-log-wrap{background:var(--bg-2)!important;border-color:var(--line)!important}.progress-log-wrap>summary{color:var(--text)!important}.progress-log-wrap .progress-log{background:var(--card)!important;color:var(--text)!important}.technical-card{background:var(--card)}

/* Data and results */
.stats-grid{gap:8px}.stat{background:var(--bg-2)!important;border:1px solid var(--line)!important}.stat b{color:var(--text)}.stat span{color:var(--text)!important}.trust-item,.intel-box,.scale-health>div{background:var(--bg-2)!important;border-color:var(--line)!important}.quality-strip span{background:var(--bg-2)!important;color:var(--text)!important;border-color:var(--line)!important}.quality-strip b{color:var(--text)!important}.scan-intelligence{background:var(--bg-2)!important;border-color:var(--line)!important;border-left:4px solid var(--muted)!important}.mini-table th{background:var(--bg-2)!important;color:var(--text)!important;border-bottom-color:var(--line)!important}.mini-table td{color:var(--text);background:var(--card);border-color:var(--line)!important}.format-legend span{background:var(--bg-2)!important;color:var(--text)!important}.notice b{color:var(--text)}

/* Other tabs */
.history-item,.browser-tab,.item{border:1px solid var(--line)!important;background:var(--card)!important;box-shadow:none!important}.history-item::before{background:var(--muted)!important}.history-preview,.tab-url{color:var(--muted)!important}.settings-grid .card,.settings-grid>div{background:var(--card)}.preview{background:var(--preview)!important;color:var(--preview-text)!important;border:1px solid var(--line)!important}

/* Mobile/side panel */
@media(max-width:560px){
  html,body{font-size:13px}
  body{padding-bottom:66px}.site-state .pill{font-size:12px}
  .section-hero{padding:8px 8px 11px;min-height:auto;margin-bottom:3px}.section-index{font-size:12px;margin-bottom:5px}.section-hero h1{font-size:26px;letter-spacing:.005em}.section-hero p{font-size:13px;margin-top:6px;line-height:1.42}.section-hero img{display:none}
  .card{padding:12px 12px;border-radius:var(--radius);margin-bottom:8px}
  .status-card{padding:9px 11px}
  .autonomous-agent-card{padding:13px!important}.agent-card-title{font-size:13px}.agent-card-head{align-items:flex-start}.agent-head-actions{gap:4px}.agent-head-actions .pill{display:none}
  .agent-chat{padding:9px;max-height:225px}
  #agentChatInput{min-height:96px;font-size:13px;padding:11px}
  .agent-controls{grid-template-columns:1fr!important}.agent-check{min-height:auto!important}.agent-options>summary small{display:none}
  .agent-submit-row{grid-template-columns:1fr}.agent-submit-hint{display:none}.agent-send{width:100%;min-height:44px}

  .agent-plan-list{padding-left:19px}.agent-plan-meta{gap:4px}.agent-plan-meta span{font-size:12px!important}
  .manual-tools-shell{margin-top:8px}.manual-tools-shell>summary{padding:10px 11px}
  .mission-os-capabilities{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.mission-os-capabilities span{font-size:13px!important}
  .mission-os-grid,.deep-grid,.interaction-grid,.settings-grid{grid-template-columns:1fr!important}
  .result-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.format-legend{grid-template-columns:1fr 1fr}
}
@media(max-width:380px){
  .topbar .site-state{max-width:155px}
  .section-hero h1{font-size:26px}.section-hero p{font-size:13px}
  .agent-card-title{font-size:13px}.agent-head-actions button{font-size:13px;padding:5px 7px}

  .format-legend{grid-template-columns:1fr}
}
.mission-os-shell{padding:0!important;overflow:hidden!important}.mission-os-shell-summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:13px 14px;background:transparent}.mission-os-shell-summary::-webkit-details-marker{display:none}.mission-os-shell-summary>span:first-child{display:flex;flex-direction:column;gap:8px;min-width:0}.mission-os-shell-summary b{color:var(--text);font-size:13px}.mission-os-shell-summary small{color:var(--text);font-size:13px;font-weight:550}.mission-os-shell-summary::after{content:'＋';color:var(--text);font-size:15px;margin-left:2px}.mission-os-shell[open]>.mission-os-shell-summary::after{content:'−'}.mission-os-shell-body{padding:0 13px 13px;border-top:1px solid var(--line);background:var(--bg-2)}.mission-os-shell:not([open]){box-shadow:none!important}.mission-os-shell:not([open]) .mission-os-shell-summary{border-radius:var(--radius)}.mission-os-shell-summary #missionOsBadge{margin-left:auto}
@media(max-width:560px){.mission-os-shell-summary{padding:11px 12px}.mission-os-shell-summary small{font-size:13px}.mission-os-shell-summary #missionOsBadge{display:none}}
/* =========================================================
   Vkladka v4.2 · UX CLARITY
   Слой воздуха: поля карточек, отбивки между блоками, подсказки разделов.
   Заголовок стоял перед правилом main, которое забрала сборка оболочки, —
   вернули на место, слой цел.
   ========================================================= */
.panel>.section-hero{margin-bottom:12px}
.card{padding:15px 16px;margin-bottom:12px}
.card+.card{margin-top:2px}
.section-hero{padding:15px 16px 16px}
.section-hero p{max-width:680px;line-height:1.55}
.autonomous-agent-card{padding:17px 17px 16px!important}

.agent-options,.agent-memory{margin-top:12px!important}
.agent-submit-row{margin-top:13px!important}
.agent-subcard,.agent-question,.agent-runtime,.agent-result{margin-top:12px}
.section-guide{display:flex;align-items:flex-start;gap:12px;background:var(--bg-2)!important;border-color:var(--line)!important;padding:13px 14px!important}
.section-guide-icon{display:grid;place-items:center;flex:0 0 auto;width:34px;height:34px;border-radius:var(--radius-xs);background:var(--accent-3);color:var(--text)}
.section-guide-icon svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.section-guide b{display:block;color:var(--text);font-size:13px}
.section-guide p{margin:4px 0 0;color:var(--text);font-size:13px;line-height:1.48}
.icon-btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
#tab-data>.quick-grid{margin:1px 0 12px}
#tab-data .task-card{margin-top:11px}
#tab-data #planCard,#tab-data #progressCard,#tab-data #answerCard{margin-top:12px}
#tab-data>.card:not(.section-guide){scroll-margin-top:76px}
#tab-tabs .card,#tab-history .card,#tab-settings .card{padding-top:15px;padding-bottom:15px}
.label{line-height:1.3}
.muted.small{line-height:1.48}
button{min-height:38px}
button.compact{min-height:34px}
.check{line-height:1.38}
input,select,textarea{line-height:1.45}
@media(max-width:560px){
  .panel>.section-hero{margin-bottom:9px}
  .section-hero{padding:10px 10px 13px}
  .section-hero h1{font-size:26px}
  .section-hero p{font-size:13px;line-height:1.5}
  .card{padding:13px 13px;margin-bottom:10px}
  .autonomous-agent-card{padding:14px!important}
  .section-guide{padding:12px!important;gap:8px}
  .section-guide-icon{width:31px;height:31px}
}
@media(max-width:380px){
  .section-hero h1{font-size:20px}
  .section-guide p{font-size:13px}
}

/* Сворачиваемые карточки продвинутых инструментов: тот же вид, что у остальных блоков */
.card-summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:8px;font-weight:750;font-size:13px;color:var(--text)}
.card-summary::-webkit-details-marker{display:none}
.card-summary::after{content:'+';font-size:15px;font-weight:500;color:var(--muted);line-height:1}
details[open]>.card-summary{margin-bottom:10px}
details[open]>.card-summary::after{content:'−'}

/* Главный экран: приветствие и быстрые действия (по макету владельца) */
.greeting{padding:2px 0 10px}
.greeting h1{margin:0;font-size:20px;line-height:1.15}
.greeting p{margin:4px 0 0;color:var(--muted);font-size:13px}
/* Было: строка с прокруткой и спрятанной полосой — четвёртое действие
   обрезалось краем панели, и о нём нельзя было догадаться. Теперь переносится. */
.action-grid{display:flex;flex-wrap:wrap;gap:6px;padding-bottom:2px}
.action-grid>*{flex:1 1 calc(50% - 6px);min-width:0}
.action-grid::-webkit-scrollbar{display:none}
.action-card{flex:0 0 88px;scroll-snap-align:start}
.action-card{display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:10px 9px;
  border:1px solid var(--line);border-radius:var(--radius);background:var(--card);text-align:left;cursor:pointer;
  transition:border-color .15s ease,transform .12s ease}
.action-card:hover{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);transform:translateY(-1px)}
.action-card:active{transform:translateY(0)}
.action-ico svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}

/* Пустой чат и пустая шапка не должны рисовать рамку и разделитель */
.agent-chat:not(:has(.agent-msg)){display:none}
.agent-card-head:not(:has(.agent-card-title)){padding-bottom:0;border-bottom:none;min-height:0}

/* Недавние задачи на главном экране */
.recent-block{margin-top:12px}
.recent-block.hidden{display:none}
.recent-list{display:flex;flex-direction:column;gap:6px}
.recent-item{display:flex;align-items:center;gap:8px;width:100%;padding:9px 10px;text-align:left;
  border:1px solid var(--line);border-radius:var(--radius-xs);background:var(--card);cursor:pointer;
  transition:border-color .15s ease}
.recent-item:hover{border-color:var(--bg-2)}
.recent-ico{flex:0 0 auto;display:grid;place-items:center;width:26px;height:26px;border-radius:var(--radius-xs);background:var(--bg-2)}
.recent-ico svg{width:14px;height:14px;fill:none;stroke:var(--text);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.recent-body{flex:1 1 auto;min-width:0}
.recent-title{font-weight:700;font-size:13px;line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.recent-sub{color:var(--muted);font-size:13px;line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.recent-time{flex:0 0 auto;color:var(--muted);font-size:13px}

/* Спокойная иерархия главного экрана: воздух вместо рамок */
.greeting{padding:4px 0 12px}
.greeting h1{font-size:26px;letter-spacing:-.01em}
#agentChatInput{min-height:78px;font-size:13px;line-height:1.5}
.autonomous-agent-card{padding:15px}
.status-card{background:transparent;border-color:transparent;padding:0 2px 4px}


.action-card{flex:0 0 96px;padding:11px 10px;border-radius:var(--radius)}
.action-ico{display:grid;place-items:center;width:26px;height:26px;border-radius:var(--radius-xs);background:var(--bg-2);margin-bottom:3px}
.action-name{font-weight:750;font-size:13px;line-height:1.2;color:var(--text)}
.action-sub{color:var(--muted);font-size:13px;line-height:1.25}
.agent-submit-row{gap:8px}
.agent-send{padding:12px 18px}

/* Кнопка «Новая» нужна только при начатой задаче: пустая шапка съедала строку */
.autonomous-agent-card:not(:has(.agent-msg)) .agent-card-head{display:none}

/* ============ Чат-раскладка главного экрана ============ */
/* только для активного раздела: иначе правило перебивает .panel{display:none}
   и «Агент» остаётся видимым поверх остальных вкладок */
#tab-agent.panel.active{display:flex;flex-direction:column;height:100%;min-height:0;padding-bottom:0}
#tab-agent .greeting{flex:0 0 auto;padding:6px 0 2px}
#tab-agent .greeting h1{font-size:20px}

/* карточка агента становится колонкой во всю высоту */
#tab-agent .autonomous-agent-card{flex:1 1 auto;display:flex;flex-direction:column;min-height:0;
  padding:0;border:none;background:transparent;box-shadow:none}

/* лента сообщений забирает свободное место */
#tab-agent .agent-chat{flex:1 1 auto;min-height:0;max-height:none;overflow-y:auto;
  border:none;background:transparent;padding:0 0 8px}

/* контекст страницы: одна тихая строка над вводом, а не карточка */
#tab-agent .status-card{flex:0 0 auto;background:transparent;border:none;
  padding:0 2px 6px;box-shadow:none}
#tab-agent .status-card .label{display:none}
#tab-agent .status-card #pageTitle{font-size:12px;font-weight:600;color:var(--muted)}
#tab-agent .status-card #pageMeta{font-size:12px;color:var(--soft)}
#tab-agent .status-card .icon-btn{width:26px;height:26px;min-height:26px}

/* блок ввода прижат к низу и выглядит как поле чата */
/* Поле ввода — одна рамка на всё: строка задачи, текст и ряд действий
   (ТЗ 13.09.2026, п. 9: «хочу, чтобы кнопки тоже были на поле ввода, прикольно
   выглядит и компактно»). Рамка и подсветка фокуса переехали с `textarea`
   сюда, иначе рамок было две — внешняя и вокруг текста. */
#tab-agent .agent-input-dock{flex:0 0 auto;position:sticky;bottom:0;
  background:var(--bg);padding-top:6px}
#tab-agent .композер-рамка{border:1px solid var(--line-strong);
  border-radius:var(--radius);background:var(--card);box-shadow:var(--shadow);
  padding:8px}
/* Подсветка фокуса — у рамки, а не у текста: человек видит, что «поле» это
   весь блок, включая кнопки. Условие на потомка (`:has`) — чтобы не заводить
   ради этого обработчик в коде: состояние и так описано разметкой. */
#tab-agent .композер-рамка:has(#agentChatInput:focus){border-color:var(--accent);
  box-shadow:0 0 0 3px var(--accent-soft)}
/* Своя ручка высоты вместо углового уголка браузера: уголок тянется вниз, а
   поле растят вверх, и целиться в него приходилось в 12 px угла. Полоса на
   верхней кромке — та часть, за которую человек и хочет держаться. */
#tab-agent .input-grip{display:flex;align-items:center;justify-content:center;height:12px;
  cursor:ns-resize;touch-action:none;border-radius:var(--radius-xs)}
#tab-agent .input-grip::before{content:"";width:34px;height:3px;border-radius:var(--radius-pill);
  background:var(--line-strong)}
#tab-agent .input-grip:hover::before{background:var(--accent)}
#tab-agent .input-grip:focus-visible{outline:2px solid var(--tab-active);outline-offset:2px}
body.тянем-поле{user-select:none;cursor:ns-resize}
/* Нижнее поле больше верхнего: последняя строка текста упиралась в кромку —
   владелец 04.09.2026 «текст слишком прислоняется к нижней части». */
/* Потолок высоты у главного поля снимается намеренно: общий `textarea
   {max-height:190px}` выше по файлу резал поле на 190 px, сколько бы ни
   ставила ручка, и предел «не закрывать ответы» вычислял уже не тот, кто
   его знает. Высоту здесь задаёт настроитьРучкуПоля() — она считает её от
   ленты ответов, оставляя видимыми не меньше ЗАПАС_ЛЕНТЫ пикселей. */
#tab-agent #agentChatInput{min-height:64px;max-height:none;border-radius:var(--radius-xs);padding:4px 5px 8px;
  border:0;background:transparent;font-size:13px;box-shadow:none;resize:none}
#tab-agent #agentChatInput:focus{outline:none}
/* Ряд под вводом — из эталона (артборд Main): значки 34, метка контекста 34,
   круглая отправка 38. Размеры не «на глаз»: они заданы в Макет/стиль.py
   (.icb, .ctx, .send) и проверяются замером в ТЕСТ_КОМПОЗЕР.py. */
/* «Говорю вслух» — из шапки карточки приветствия (артборд Main). */
#tab-agent .voice-out{display:flex;align-items:center;gap:4px;min-height:var(--h-btn-sm);padding:4px 6px;
  border:0;border-radius:var(--radius-xs);background:none;cursor:pointer;font-size:13px;font-weight:600;
  letter-spacing:.02em;color:var(--muted);white-space:nowrap}
#tab-agent .voice-out svg{width:13px;height:13px;flex:0 0 auto;fill:none;stroke:currentColor;
  stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
#tab-agent .voice-out[aria-pressed="true"]{color:var(--accent-2)}
#tab-agent .voice-out:hover{background:var(--bg-2)}
/* Запись голоса — артборд Voice. Карточка живёт только пока идёт запись. */
#tab-agent .voice-card{margin-top:10px;border-color:var(--accent-2)}
#tab-agent .voice-dot{width:34px;height:34px;border-radius:var(--radius-circle);background:var(--btn);
  display:flex;align-items:center;justify-content:center;flex:0 0 auto}
#tab-agent .voice-dot svg{width:17px;height:17px;fill:none;stroke:var(--ink-on-accent);
  stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
#tab-agent .voice-wave{display:flex;gap:4px;align-items:center;height:26px;margin-top:10px}
#tab-agent .voice-wave span{width:4px;border-radius:var(--radius-pill);background:var(--accent);flex:0 0 auto}
#tab-agent .voice-heard{font-size:13px;line-height:1.4;color:var(--text)}
#tab-agent .voice-note{font-size:13px;line-height:1.4;color:var(--muted)}
/* Строка задачи и приложенные файлы — над полем ввода (ТЗ 10.09.2026,
   пункт 7). Обе строки появляются только когда есть что показать: пустая
   полоса над полем — те же 20 px шума, из-за которых ряд внизу и распух. */
/* «Что читаю» и «как работать» стоят в НИЖНЕМ ряду, вместе с остальными
   кнопками (владелец 15.09.2026: «должны быть ниже со всеми, а не сверху сами
   по себе, только место занимают»). Это отменяет пункт 7 ТЗ 10.09.2026, где
   ряд под вводом держали под одни действия: на узкой панели подписи у этих
   кнопок прячутся стилем, и наверху оставались два голых значка — отдельная
   строка ради них не окупалась. Отступа снизу тут больше нет: ряд сам стоит
   под полем. */
#tab-agent .composer-задача{display:flex;flex-wrap:wrap;align-items:center;gap:6px;
  min-width:0}
/* В ряду действий обёртка убирается из потока: её дети становятся прямыми
   элементами строки и выравниваются с остальными кнопками. Замер 15.09.2026
   на 460 px: пока обёртка оставалась своим flex-контейнером, её кнопки стояли
   на top=709 против 713 у соседей — ряд «ехал» на четыре пикселя, и сторож
   ТЗ считал это отдельной строкой. Якорь меню это не трогает: он на
   `.composer-row`, а `.ctx-wrap` и так `position:static`. */
#tab-agent .composer-row .composer-задача{display:contents}
/* И отступ снизу, оставшийся от прежнего места над полем: он делал бокс кнопки
   на 8 px выше соседей, а центрирование ряда поднимало её на 4 px. Замер на
   460 px: top=709 против 713 — глазом почти незаметно, а ряд уже неровный. */
#tab-agent .composer-row .composer-задача .ctx{margin-bottom:0}
#tab-agent .composer-задача:empty,
#tab-agent .composer-задача.hidden{display:none}
/* Фишки описания — ступень 32 против 38 у действий внизу: разная роль читается
   размером, и строка над полем не спорит с рядом кнопок. */
#tab-agent .composer-задача .ctx,
#tab-agent .composer-files{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}
/* Очередь сообщений (ТЗ 10.09.2026, пункт 5) — над полем, рядом с файлами и в
   той же роли: «вот что уйдёт». Номер слева отвечает на вопрос «каким по
   счёту», крестик убирает до отправки. */
#tab-agent .composer-очередь{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}
#tab-agent .composer-очередь.hidden{display:none}
#tab-agent .очередь-чип{display:flex;align-items:center;gap:6px;max-width:100%;
  padding:6px 8px;border:1px dashed var(--accent-3);border-radius:var(--radius-xs);
  background:var(--accent-soft);font-size:13px;color:var(--text)}
#tab-agent .очередь-чип b{flex:0 0 auto;color:var(--accent);font-variant-numeric:tabular-nums}
#tab-agent .очередь-чип-x{min-height:0;padding:0 2px;border:0;background:none;line-height:1;
  font-size:15px;color:var(--muted);cursor:pointer}
#tab-agent .очередь-чип-x:hover{color:var(--bad)}
#tab-agent .file-chip{display:flex;align-items:center;gap:6px;max-width:100%;
  padding:6px 8px;border:1px solid var(--line);border-radius:var(--radius-xs);
  background:var(--bg-2);font-size:13px;color:var(--text)}
#tab-agent .file-chip-x{min-height:0;padding:0 2px;border:0;background:none;line-height:1;
  font-size:15px;color:var(--muted);cursor:pointer}
#tab-agent .file-chip-x:hover{color:var(--bad)}
/* Состояние перетаскивания — накрывает панель, пока файл держат над ней. */
#tab-agent .drop-zone{position:fixed;left:14px;right:14px;top:66px;bottom:66px;z-index:70;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  border:1.5px dashed var(--accent);border-radius:var(--radius);background:var(--bg-2);
  text-align:center;padding:18px;pointer-events:none}
#tab-agent .drop-zone svg{width:20px;height:20px;fill:none;stroke:var(--accent);
  stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
/* Тот же список в «Данных»: там у файла названо, что он источник. */
.attached-list{display:flex;flex-direction:column;gap:8px}
.attached-item{display:flex;flex-direction:column;gap:4px;padding:10px;
  border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--card)}
/* Режим самостоятельности под чатом больше не показывается (владелец
   08.09.2026): выбор живёт в Настройках → «Самостоятельность и обход». */

#tab-agent .composer-row.top10{margin-top:2px}
#tab-agent .composer-row{display:flex;align-items:center;justify-content:space-between;
  gap:8px;margin-top:10px;
  /* Якорь для выпадающих меню композера: см. `.ctx-menu` ниже. */
  position:relative}
#tab-agent .icb{width:34px;height:34px;min-height:34px;padding:0;border-radius:var(--radius-xs);
  border:1px solid var(--line);background:var(--card);display:flex;align-items:center;
  justify-content:center;flex:0 0 auto;color:var(--muted);cursor:pointer}
#tab-agent .icb svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.7;
  stroke-linecap:round;stroke-linejoin:round}
#tab-agent .icb:hover{border-color:var(--accent-2);color:var(--accent-2)}
#tab-agent .icb[aria-pressed="true"]{background:var(--btn);border-color:var(--btn);
  color:var(--ink-on-accent)}
/* Позицию меню задаёт строка композера, а не кнопка: пока якорем была кнопка
   (`position:relative` здесь), меню открывалось от её левого края и уезжало за
   правый край панели — замер 03.09.2026 на 470 px: меню 230 px от x=272, то
   есть 32 px висели снаружи. Владелец: «при раскрытии часть прячется за
   фоном… почему бы не раскрывать по центру». */
#tab-agent .ctx-wrap{position:static;display:flex;min-width:0}
/* Якорь меню — та строка, в которой стоит сама фишка, и он обязан ехать
   вместе с ней. Дважды проверено болью:
   10.09.2026 фишки «Эта страница» и «после плана» ушли из ряда действий в
   отдельную строку над полем (ТЗ, пункт 7), а якорем осталась строка
   действий — меню улетело ЗА ВЕРХНИЙ край: замер 11.09.2026 на 360 и 460 px
   дал верх −130 при высоте окна 900, нажать было нечего.
   15.09.2026 фишки вернулись в ряд действий, а якорь остался на них самих —
   и меню сжалось до ширины кнопки: замер дал 175 px при окне 400, вместо
   ширины панели. Поэтому здесь якоря НЕТ: его держит `.composer-row`, а
   `.composer-задача` остаётся прозрачной для позиционирования, как и
   `.ctx-wrap` выше. */
/* `hidden` обязан побеждать раскладку: `display:flex` выше по силе, и
   скрытая из кода кнопка оставалась на экране (веб-версия, «Без
   страницы», 09.09.2026). */
#tab-agent .ctx[hidden]{display:none}
#tab-agent .ctx{height:34px;min-height:34px;display:flex;align-items:center;gap:6px;
  padding:0 10px;border:1px solid var(--line);border-radius:var(--radius-xs);background:var(--card);
  font-size:13px;font-weight:500;color:var(--muted);white-space:nowrap;cursor:pointer;
  max-width:100%}
#tab-agent .ctx svg{width:14px;height:14px;flex:0 0 auto;fill:none;stroke:currentColor;
  stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
#tab-agent .ctx .ctx-chev{width:12px;height:12px;stroke-width:2.2;color:var(--soft)}
#tab-agent .ctx:hover{border-color:var(--accent-2);color:var(--accent-2)}
/* Меню занимает всю ширину строки композера: так оно целиком на виду при
   любой ширине панели и не зависит от того, где стоит кнопка. Список вкладок
   бывает длинным (у владельца было открыто 23) — даём прокрутку, иначе хвост
   уезжает за верх панели и достать его нечем. */
#tab-agent .ctx-menu{position:absolute;left:0;right:0;bottom:calc(100% + 6px);z-index:40;
  min-width:0;max-height:min(52vh,420px);overflow-y:auto;overscroll-behavior:contain;
  padding:6px;border:1px solid var(--line);border-radius:var(--radius);
  background:var(--card);box-shadow:var(--shadow-strong)}
#tab-agent .ctx-menu-i{display:block;width:100%;min-height:0;padding:8px 10px;border:0;
  border-radius:var(--radius-xs);background:none;text-align:left;font-size:13px;font-weight:600;
  color:var(--text);cursor:pointer}
#tab-agent .ctx-menu-i small{display:block;margin-top:2px;font-size:13px;font-weight:400;
  line-height:1.35;color:var(--muted);white-space:normal}
#tab-agent .ctx-menu-i:hover,#tab-agent .ctx-menu-i[aria-checked="true"]{background:var(--bg-2)}
/* Строка-объяснение под списком: не пункт меню, нажимать нечего. */
#tab-agent .ctx-menu-note{padding:8px 10px 4px;font-size:var(--fs-12);line-height:1.4;
  color:var(--muted)}

/* Свёрнутая техническая справка в письме поддержки: подпись выглядит как
   заголовок раздела, потому что по смыслу им и является. */
.help-sends>summary{cursor:pointer;font-size:var(--fs-13);font-weight:700;color:var(--muted);
  list-style:none}
.help-sends>summary::-webkit-details-marker{display:none}
.help-sends>summary::after{content:'＋';float:right;color:var(--soft)}
.help-sends[open]>summary::after{content:'−'}
#tab-agent .send{width:34px;height:34px;min-height:34px;padding:0;border-radius:var(--radius-circle);
  border:0;background:var(--btn);color:var(--ink-on-accent);display:flex;align-items:center;
  justify-content:center;flex:0 0 auto;cursor:pointer}
#tab-agent .send svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.2;
  stroke-linecap:round;stroke-linejoin:round}
#tab-agent .send:hover{background:var(--btn-hover)}
#tab-agent .send:disabled{opacity:.55;cursor:default}
/* Пока идёт работа — стрелка уступает место точкам: подпись у кнопки теперь
   не текстом, а названием, и переписывать её содержимое нельзя. */
#tab-agent .send.busy svg{display:none}
#tab-agent .send.busy::after{content:"";width:14px;height:14px;border-radius:var(--radius-circle);
  border:2px solid var(--ink-on-accent);border-top-color:transparent}
@media(prefers-reduced-motion:no-preference){#tab-agent .send.busy::after{animation:кружок .8s linear infinite}}
@keyframes кружок{to{transform:rotate(360deg)}}

/* редкое прячем в ряд мелких кнопок под вводом */
#tab-agent .agent-options,#tab-agent .agent-memory{border:none;background:transparent}
#tab-agent .agent-options>summary,#tab-agent .agent-memory>summary{
  padding:6px 0;font-size:13px;color:var(--muted);font-weight:600}
#tab-agent .agent-options>summary small{display:none}

/* Плитки задач раньше были таблетками без пояснения, и подпись раздела пряталась
   (display:none). По артборду PageOffer это карточки с названием и строкой
   пояснения, а у списка есть заголовок — вид задан ниже, одним местом. */
#tab-agent .quick-actions{flex:0 0 auto;margin-top:0;padding-bottom:6px}

/* недавние задачи над вводом, компактно */
#tab-agent .recent-block{flex:0 0 auto;margin-top:0}
#tab-agent .recent-item{padding:8px 10px;border-radius:var(--radius-xs)}

/* Порядок на экране задаёт разметка, а не числа. Прежний слой раздавал order
   от 1 до 8, и после переезда блоков в ленту итог оказывался ВЫШЕ понимания
   и хода работы: у плана и хода стояло order:2, у итога — 0. Числа разошлись
   с тем, что видно, ровно так, как и предупреждал комментарий рядом. */
#tab-agent .autonomous-agent-card{display:contents}

/* Тёмная тема живёт в `дизайн/токены.css`, а не здесь.
 *
 *  До 15.09.2026 этот файл держал СВОЮ копию тёмной палитры, и она перебивала
 *  собранные токены: подключается `panel.css` после них. Копия устарела —
 *  акцент в ней был #5B8DEF вместо фирменного #2F6BFF, и синий в программе не
 *  совпадал с синим на сайте (владелец, задача 8). Файл общий для обеих целей,
 *  так что расходились и расширение, и окно.
 *
 *  Правда о цветах — `Макет/стиль.py` → `Инструменты/собрать_токены.py` →
 *  `дизайн/токены.css`. Вторая копия палитры в CSS разводит код с эталоном
 *  молча: местный цвет всегда выигрывает у токена, и заметно это только глазом. */

/* Тема меняется — цвета должны идти за ней, а не быть зашитыми */
.ghost{background:transparent;color:var(--text);border-color:var(--line)}
.ghost:hover{background:var(--control-hover)}
.agent-memory,.agent-options{background:var(--bg-2);color:var(--text)}
.agent-memory>summary,.agent-options>summary{color:var(--text)}
#tab-agent .action-ico svg{stroke:currentColor}
#tab-agent .status-card #pageTitle{color:var(--text)}
#tab-agent .status-card #pageMeta{color:var(--muted)}
.recent-item{background:var(--card);color:var(--text)}
.recent-ico{background:var(--bg-2)}
.recent-ico svg{stroke:currentColor}
html[data-theme="dark"] .brand-wordmark{filter:invert(1) hue-rotate(180deg)}
@media (prefers-color-scheme: dark){
  html:not([data-theme="light"]) .brand-wordmark{filter:invert(1) hue-rotate(180deg)}
}
.greeting h1,h1{color:var(--text)}
#tab-agent .greeting h1{color:var(--text)}
#tab-agent .action-sub{display:none}
#tab-agent .action-card{flex:0 0 auto;padding:7px 12px}

/* Заголовки и подсказки разделов: правило h1 по специфичности проигрывало */
.section-hero h1,.section-hero h2,.greeting h1{color:var(--text)}
.section-hero p,.section-guide p{color:var(--muted)}
.section-guide.card{background:var(--bg-2);border-color:var(--line)}
.section-guide.card b,.section-guide.card .strong{color:var(--text)}
/* Поля ввода: фон уже по теме, текст обязан идти следом */
input,select,textarea{color:var(--text);background:var(--card);border-color:var(--line)}
input::placeholder,textarea::placeholder{color:var(--soft)}
option{color:var(--text);background:var(--card)}

/* Остатки, не следовавшие теме */
.section-guide,.section-guide.card{background:var(--bg-2)!important;border-color:var(--line)!important;color:var(--text)!important}
.section-guide b,.section-guide .strong{color:var(--text)!important}
.section-guide p,.section-guide small,.section-guide 
.mission-os-shell-summary .label,.mission-os-shell-summary small{color:var(--muted)!important}
.mission-os-shell-summary b{color:var(--text)!important}
/* Белый был вбит цифрой и в тёмной теме давал 3.23 на светло-синей кнопке. */
.primary,.agent-send{background:var(--btn)!important;border-color:var(--btn)!important;color:var(--ink-on-accent)!important}
.primary:hover,.agent-send:hover{background:var(--btn-hover)!important;border-color:var(--btn-hover)!important}
.primary:disabled,.agent-send:disabled{opacity:.55}
/* Подписи внутри свёрнутых блоков тоже следуют теме */
summary .label,summary small,summary b,summary span{color:inherit}
details>summary{color:var(--text)}
details>summary .label{color:var(--muted)}

/* Ссылки источников следуют теме */
.browser-tab,.browser-tab .tab-title{color:var(--text)}
.browser-tab .tab-url,.tab-url{color:var(--muted)}
.tab span{color:inherit}
.tab .tab-icon svg{stroke:currentColor}
.topbar .subtitle,.topbar .brand-kicker{color:var(--muted)}
/* Нижнее меню: один набор правил вместо накопленных слоёв */
.tab,.tab span{color:var(--tab-label)}
.tab.active,.tab.active span{color:var(--tab-active)}

/* Находка аудита: в двухколоночной раскладке (окно ≥561px) панели даётся 209px,
   а строке схемы жёстко нужно 329px — флажок, поле и «×» уезжали за правый край
   экрана без всякой прокрутки. Меряем по ширине самой панели, а не окна:
   на широком окне, где места хватает, прежние пять колонок сохраняются. */
@media (min-width:561px){.schema-studio{container-type:inline-size}}
@container (max-width:330px){
  .schema-row{grid-template-columns:minmax(0,1fr) minmax(0,1fr);row-gap:4px}
  .schema-remove{grid-column:auto;justify-self:start}
}

/* Находки аудита 25.08 — три дефекта, которые прятались за замером «по одному элементу».

   1. Полотно страницы. html,body висели на --ui-canvas:#F4F1EC — переменной прежней
      тёплой палитры, у которой нет варианта для тёмной темы. В тёмной теме за всем
      интерфейсом оставался светло-бежевый лист, видимый в любом зазоре.
   2. Главное поле ввода. #tab-agent #agentChatInput:focus{outline:none} по
      специфичности (0,2,1,0) перебивало общее правило :focus-visible — у самого
      важного поля продукта не было видимого фокуса вообще.
   3. Кнопка удаления строки схемы: 23px ширины при норме WCAG 2.2 в 24px. */
html,body{background:var(--bg)}
/* С 13.09.2026 контур фокуса рисует РАМКА ввода, а не сам текст: кнопки
   переехали внутрь рамки (ТЗ окна, п. 9), и собственный контур поля читался
   вторым прямоугольником внутри первого — тот самый двойной контур, который
   владелец видит как «поле в поле». Фокус при этом не пропал: рамка меняет
   цвет края и получает кольцо, и это проверяет ТЕСТ_ДОСТУПНОСТЬ.py, который
   умеет засчитывать кольцо, нарисованное предком. */
#tab-agent #agentChatInput:focus-visible{outline:none}

/* Находки аудита 26.08.

   1. Флажки. Браузер рисует их 13-14px, а WCAG 2.2 (2.5.8) требует цель нажатия
      не меньше 24×24. Растягиваем саму цель, оставляя рисунок прежним: increasing
      только область нажатия не портит вид, но делает попадание возможным.
      Подпись в .check и так кликабельна, но полагаться на неё нельзя — рядом
      встречаются флажки без обёртки. */
/* 03.09.2026 владелец: флажки «выделяются, слишком большие и не скруглённые».
   Замер подтвердил: браузерный квадрат 24×24, `border-radius: 0`, заливка
   `accent-color` = --text, то есть почти чёрная. Рисуем сами: цель нажатия
   остаётся 24×24 (WCAG 2.5.8 — её и стерегут тесты доступности), а видимый
   квадратик 18 px берёт скругление и цвет у остального интерфейса. */
.check input[type=checkbox],.check input[type=radio],
input[type=checkbox],input[type=radio]{
  min-width:24px;min-height:24px;width:24px;height:24px;flex:0 0 auto;
  appearance:none;-webkit-appearance:none;margin:0;padding:0;border:0;
  background:transparent;display:inline-grid;place-content:center;cursor:pointer}
input[type=checkbox]::before,input[type=radio]::before{
  content:"";width:18px;height:18px;box-sizing:border-box;
  border:1.5px solid var(--line-strong);border-radius:var(--radius-xs);
  background:var(--control);transition:background .12s ease,border-color .12s ease}
input[type=radio]::before{border-radius:var(--radius-circle)}
input[type=checkbox]:checked::before{
  border-color:var(--accent);background:var(--accent) no-repeat center/12px 12px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.6 4.6L19 7.4'/%3E%3C/svg%3E")}
input[type=radio]:checked::before{border-color:var(--accent);border-width:5.5px}
input[type=checkbox]:focus-visible::before,input[type=radio]:focus-visible::before{
  outline:2px solid var(--accent);outline-offset:2px}
input[type=checkbox]:disabled::before,input[type=radio]:disabled::before{opacity:.5}

/* Один ритм «подпись → то, что под ней». Владелец 03.09.2026: «сливается с
   заголовком… нужно сделать нормальные и одинаковые отступы». Замер показал
   разнобой: под «Что видит модель» 10 px, под «Тема» — 0. Отступ задаёт сама
   подпись, а разовые `top10`/`top12` у следующего блока гасятся: иначе к
   восьми прибавлялось ещё десять и ритм снова расходился. */
.label{margin-bottom:8px}
/* Отступ подписи даёт ЛИБО её margin, ЛИБО gap родителя — не оба сразу.
   В шапке mission-os складывались 8 + 4 и выходило 12 против 8 у соседей:
   тот самый разнобой, который владелец 03.09.2026 назвал «нужно сделать
   нормальные и одинаковые отступы». Замер это и поймал: {8, 12}. */
.mission-os-shell-summary .label{margin-bottom:0}
.label + *{margin-top:0}
/* Подпись в строке с кнопкой отступ снизу не берёт: там она не заголовок. */
.row > .label{margin-bottom:0}

/* Нижний край. Владелец 03.09.2026: «много нижних блоков слипаются с нижними
   краями и меню». Замер на 400 px с прокруткой до упора: на «Обзоре» и в
   «Настройках» между последним блоком и полосой разделов было РОВНО 0 px.
   Причина не в отсутствии отступа — `main` его задаёт (18 px), но `main`
   ещё и flex-колонка с прокруткой, а в такой конец-падинг браузер в конец
   прокрутки не пускает. Поэтому место занимает распорка-элемент: её высоту
   прокрутка видит всегда. */
main::after{content:"";display:block;flex:0 0 auto;height:var(--pad-screen)}
/* У «Агента» низ занимает строка ввода: она обязана прилегать к полосе
   разделов, иначе под ней висит пустая полоса. Распорка нужна разделам,
   которые кончаются содержимым, а не закреплённым вводом — прогон 03.09.2026
   поймал это двумя провалами: «ввод прижат к меню | 32 px». */
main:has(> #tab-agent.active)::after{display:none}

/* 2. Плашка режима на узкой панели уезжала за правый край: она лежит в строке
      с текстом, который её выталкивает. Разрешаем переносить и сжимать. */
#interactionTargetMode{max-width:100%;white-space:normal;overflow-wrap:anywhere}

/* Аудит 26.08: пробовал ускорить первое открытие «Исследования» через
   content-visibility. Честный замер на свежем профиле браузера, четыре пары
   прогонов: медиана 173 мс с правкой против 196 мс без неё при разбросе
   147–238. Выигрыш внутри шума — правку снял, чтобы не держать изменение,
   польза которого не доказана. Сам кадр остаётся открытой находкой. */

/* Живой текст ответа: показывается, пока модель отвечает, и исчезает,
   когда ответ готов и переехал в карточку результата. */
.stream-preview{max-height:180px;overflow:auto;white-space:pre-wrap;word-break:break-word;font-size:13px;line-height:1.5;color:var(--muted);background:var(--bg-2);border:1px solid var(--line);border-radius:var(--radius-xs);padding:8px}

/* --- Главный экран: лента сверху, ввод внизу ---------------------------- */

/* Лента забирает всё свободное место и прокручивается сама. Ввод остаётся
   на месте: в переписке он не должен уезжать вместе с сообщениями. */
#tab-agent .chat-feed{flex:1 1 auto;min-height:0;overflow-y:auto;overflow-x:hidden;
  display:flex;flex-direction:column;gap:8px;padding:4px 2px 8px;scroll-behavior:smooth}
/* Пока переписки нет, приветствие стоит внизу — прямо над вводом, как в
   артборде Main: свободное место остаётся сверху, а не дырой посередине.
   Место занимает распорка, а не отступ на первом ребёнке: `:first-child`
   смотрит на разметку, а не на видимость, поэтому отступ доставался скрытому
   знакомству и не работал — а когда знакомство появлялось, экран прыгал вниз
   на 420 px (замер layout-shift: CLS 0.23). Распорке всё равно, что скрыто.
   justify-content тут нельзя: у прокручиваемого контейнера он обрезает верх,
   когда сообщений станет много. */
#tab-agent .chat-feed>.feed-spacer{flex:0 0 0;height:0;margin:0;padding:0}
#tab-agent .chat-feed:not(:has(#agentChatMessages > *))>.feed-spacer{flex:1 1 auto}
/* Без черты над полем (ТЗ 13.09.2026, п. 10): поле и так отделено своей
   рамкой, а вторая линия в двух пикселях от неё читается как шов. */
#tab-agent .chat-dock{flex:0 0 auto;display:flex;flex-direction:column;gap:6px;
  padding-top:8px;background:var(--bg)}

/* Внутри ленты порядок задаёт разметка, а не числа: числа расходились с тем,
   что видно на экране, и блоки перепрыгивали друг через друга. */
#tab-agent .chat-feed>*,#tab-agent .chat-dock>*{order:0;margin-top:0}

/* --- Приветствие первого экрана (артборд Main) -------------------------- */
/* Размеры взяты из эталона: карточка 12/13, приветствие 13 px, строка «что
   вижу» 12 px приглушённым, подсказки — таблетки 13 px. */
#tab-agent .greeting-card{padding:12px 13px}
/* Имя написано обычным «Vkladka», а прописными его делает оформление: так
   озвучка читает название, а не по буквам, и проверка русского текста не
   принимает его за английский ярлык. */
/* Имя программы, а не служебная подпись: капитель с разрядкой делала из
   него третий логотип рядом с двумя настоящими. */
/* Имя программы читается, а не угадывается: на --soft контраст был 2.63
   при норме 4.5 (ТЕСТ_СТИЛЬ). Имя — не служебная подпись. */
.greeting-lab{display:inline-block;font-size:12px;text-transform:none;letter-spacing:-.02em;font-weight:700;color:var(--text)}
.greeting-mark{width:15px;height:15px;flex:0 0 auto;color:var(--accent);
  fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.greeting-hi{font-size:13px;line-height:1.45;color:var(--text);font-weight:600}
.greeting-sees{font-size:13px;line-height:1.42;color:var(--muted)}
.greeting-page{color:var(--text);font-weight:600}
/* Пояснение под заголовком страницы. Цвет не осветляем: --soft на белом даёт
   2,63 — это подпись под значком, а не текст, который читают. */
.greeting-meta{display:block}
/* Предложения действия — сетка равных ячеек, а не таблетки по содержимому.
   31.08.2026 владелец: «кнопки отличаются по размеру, у них другие округления
   по углам, и много пустого места». Так и было: ширина от длины слова, радиус
   999 против 14 у соседних кнопок, а пятая кнопка висела сиротой в своём ряду.
   Последняя нечётная занимает ряд целиком — ряд заполнен всегда. */
.greeting-chips{display:grid;grid-template-columns:1fr;gap:8px}
/* Две колонки только там, где подпись помещается в строку. На 400 px
   «Что можно с этой страницей» в половине ряда не помещалась: до
   03.09.2026 текст вылезал за кнопку, а после разрешённого переноса
   кнопка выросла до 51 px и выпала из шкалы высот. Одна колонка
   решает обе беды разом и держит ряд заполненным. */
@media(min-width:520px){.greeting-chips{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* Своя таблетка: общий .chip красится в зелёный фон подтверждения и здесь
   читался бы как состояние, а не как предложение действия. */
.greeting-chips .chip{display:flex;align-items:center;justify-content:center;text-align:center;
  min-height:var(--h-btn);border:1px solid var(--line);background:var(--card);color:var(--text);
  border-radius:var(--radius-xs);padding:8px 12px;font-size:13px;font-weight:600;cursor:pointer;
  /* Общее `button{white-space:nowrap}` держало «Что можно с этой страницей» в
     одну строку, и на 400 px текст вылезал за кнопку по 21 px с каждой стороны
     (замер 03.09.2026 — жалоба владельца «тексты вылазят за кнопку»). Здесь
     кнопка — плитка с подписью в две строки, а не короткая команда. */
  white-space:normal;overflow-wrap:anywhere;line-height:1.28}
.greeting-chips .chip:last-child:nth-child(odd){grid-column:1/-1}
.greeting-chips .chip:hover{background:var(--control-hover)}
/* Рамка акцентная, а текст — тёмный акцент: --accent на бледной заливке даёт
   4,16, ниже порога читаемости. */
.greeting-chips .chip-accent{border:1.5px solid var(--accent);color:var(--accent-2);background:var(--accent-soft)}
.greeting-chips .chip-accent:hover{background:var(--accent-3)}

/* Меню «ещё» в шапке: список чатов и новая задача. */
.top-more{position:relative;flex:0 0 auto}
.top-menu{position:absolute;right:0;top:calc(100% + 6px);z-index:40;min-width:172px;
  display:flex;flex-direction:column;padding:6px;background:var(--card);
  border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 8px 28px rgba(58,61,64,.14)}
.top-menu-i{display:block;width:100%;text-align:left;padding:9px 10px;min-height:38px;
  background:transparent;border:0;border-radius:var(--radius-sm);color:var(--text);font-size:13px;
  font-weight:500;cursor:pointer}
.top-menu-i:hover{background:var(--bg-2)}

/* Карточки понимания, уточнения и плана — это реплики собеседника, а не форма:
   без рамки во всю ширину и без крупных заголовков-ярлыков. */
#tab-agent .chat-feed .card{margin-bottom:0;padding:11px 12px;border-radius:var(--radius)}



/* Быстрые действия и строка страницы — тихие подсказки над полем ввода. */
#tab-agent .chat-dock .quick-actions{padding-bottom:0}
#tab-agent .chat-dock .status-card{padding:0 2px}
#tab-agent .chat-dock .agent-input-dock{position:static;padding-top:0}
#tab-agent .chat-dock .agent-options,#tab-agent .chat-dock .agent-memory{margin-top:0}

/* Полная высота под чат: раньше main мерился по содержимому, и лента
   оставалась узкой полоской, сколько бы места ни было на экране. */
html,body{height:100%}
body{display:flex;flex-direction:column;min-height:100%}
body>main{flex:1 1 auto;min-height:0;display:flex;flex-direction:column}
#tab-agent.panel.active{flex:1 1 auto;min-height:0}

/* --- Список чатов ------------------------------------------------------- */
/* В боковой панели мало места: список выезжает поверх и закрывается
   нажатием мимо или Esc, а не занимает экран постоянно. */
.chat-list-backdrop{position:fixed;inset:0;z-index:40;background:rgba(8,12,22,.34)}
.chat-list{position:fixed;top:0;left:0;bottom:0;z-index:41;width:min(88vw,300px);
  display:flex;flex-direction:column;gap:0;padding:12px;overflow-y:auto;
  background:var(--card);border-right:1px solid var(--line);box-shadow:var(--shadow-strong)}
.chat-list-head{display:flex;align-items:center;gap:8px}
/* «+ Чат» слева, крестик справа: распорку даёт auto-отступ, а не растянутая
   на всю ширину кнопка — она и была тем «занимает место», от чего владелец
   04.09.2026 отказался в веб-окне. */
.chat-list-head #chatNew{margin-right:auto}
/* Крестик — на той же ступени, что «+ Чат» и чипы папок ниже: 38 рядом с 32
   и есть тот «разнокалиберный ряд», который владелец видит первым. */
.chat-list-head .icon-btn{width:var(--h-btn-sm);height:var(--h-btn-sm);
  min-height:var(--h-btn-sm);padding:0}
.chat-list-head .wide{flex:1 1 auto}
/* Глобальный `.chip` зелёный (--good-soft): зелень тут означала бы «хорошо»,
   а это просто вкладка. Вид задаём явно и тот же, что у вкладок в окне. */
/* Ступень 32 — та же, что у папок в веб-окне: список один, и выглядеть он
   обязан одинаково. Без явной пары `height` + `min-height` правило
   `button{min-height:var(--h-btn)}` держит чипы на 38 (замер 04.09.2026:
   в панели 38 против 32 в окне). */
/* Вход «+ Папка» — пунктирная вкладка, а не зелёный чип: он не выбирает,
   а заводит. Зелень глобального `.chip` тут читалась как «всё хорошо».
   Цвет акцентный: владелец 04.09.2026 просил «сам + сделать чуть в
   выделении, чтобы было понятно». */
.chat-project-add{height:var(--h-btn-sm);min-height:var(--h-btn-sm);padding:0 10px;
  background:transparent;border-color:var(--accent-3);border-style:dashed;
  color:var(--accent);font-weight:600}
.chat-project-add:hover{background:var(--accent-soft);border-style:solid}
.chat-items{display:flex;flex-direction:column;gap:6px}
.chat-item{border:1px solid transparent;border-radius:var(--radius-xs);padding:6px 8px;background:transparent}
.chat-item:hover{background:var(--bg-2)}
.chat-item.current{border-color:var(--accent-3);background:var(--accent-soft)}
.chat-item-open{display:flex;flex-direction:column;gap:4px;width:100%;text-align:left;
  background:transparent;border:none;padding:0;color:var(--text)}
.chat-item-open b{font-size:13px;font-weight:750;line-height:1.3}
.chat-item-open span{font-size:13px;color:var(--muted);line-height:1.35;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
.chat-item-row{display:flex;align-items:flex-start;gap:6px}
/* «⋮» разговора в списке расширения — тот же знак и вид, что в боковом списке
   окна и под ответом: три круглые точки SVG, акцентный цвет, мягкая подсветка,
   без рамки и подъёма. Базовый `.icon-btn svg{fill:none;stroke}` нарисовал бы
   кольца, поэтому заливку возвращаем явно. */
.chat-item-more.icon-btn{width:28px;height:28px;min-height:28px;flex:0 0 auto;
  opacity:.6;background:transparent;border:0;color:var(--accent)}
.chat-item-more.icon-btn:hover{background:var(--accent-soft);color:var(--accent);
  transform:none;box-shadow:none;border:0}
.chat-item-more svg{width:16px;height:16px;fill:currentColor;stroke:none}
.chat-item:hover .chat-item-more,.chat-item.current .chat-item-more{opacity:1}
.chat-item-actions{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px}
.chat-item-actions button{font-size:13px;padding:4px 7px;min-height:24px}
.chat-item-actions .опасное{color:var(--bad)}
#chatListOpen{margin-right:6px}

/* Утилита из эталона: там расстояние 6 px между значком и подписью. В панели
   такого класса не было, и значок с подписью слипались. */
.gap6{gap:6px}

/* Переписка — часть ленты, а не окно в окне. Своя рамка, своя прокрутка и
   максимальная высота превращали её в коробку высотой 8 px: сообщения в ней
   были, но не показывались вовсе (замер: три реплики по 45 px внутри блока
   высотой 8). Прокручивается лента целиком, как в переписке. */
#tab-agent .chat-feed .agent-chat{flex:0 0 auto;max-height:none;overflow:visible;
  padding:0;border:0;background:transparent;border-radius:0;margin-top:0;gap:8px}
/* Карточки миссии стоят В переписке (ТЗ 10.09.2026, пункт 6), а собственный
   отступ `top10` внутри неё складывался с зазором ленты: 8 между репликами и
   18 перед итогом — тот самый «разнобой соседних рядов». Шаг задаёт лента. */
#tab-agent .chat-feed .agent-chat>*{margin-top:0}

/* Всплывающая строка ответов панели. Живёт над меню, поверх содержимого,
   и уходит сама: это сообщение, а не блок интерфейса. */
/* Место в раскладке задаёт оболочка (Инструменты/этап2_оболочка.py): полоса
   стоит над меню и не накрывает кнопки. Здесь — только её вид. */
/* ── Дерево папок в списке разговоров ────────────────────────────────────
   Папка — строка той же высоты, что и разговор, но со своей ролью: стрелка,
   имя, счётчик; «+» и крестик проявляются при наведении, а место держат
   всегда — иначе строка дёргается по ширине под курсором. */
/* Поля те же, что у строки разговора (`.chat-item`): прозрачная рамка и
   8 px по бокам. Без них колонка «✕» у папки уходила на 9 px правее колонки
   «⋮» у разговора — замер 10.09.2026 дал 287 против 278, и два соседних ряда
   читались как два разных списка. */
.chat-папка{display:flex;align-items:center;gap:4px;margin-top:4px;
  border:1px solid transparent;padding:0 8px}
.chat-папка-открыть{flex:1 1 auto;min-width:0;display:flex;align-items:center;gap:6px;
  height:var(--h-btn-sm);min-height:var(--h-btn-sm);padding:0;border:0;background:none;
  border-radius:var(--radius-xs);color:var(--text);font-size:13px;text-align:left}
.chat-папка-открыть:hover{background:var(--control-hover)}
.chat-папка-открыть b{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;
  white-space:nowrap;font-weight:660}
.chat-папка-открыть i{flex:0 0 auto;font-style:normal;font-size:12px;color:var(--muted);
  font-variant-numeric:tabular-nums}
.chat-папка-стрелка{flex:0 0 auto;width:14px;height:14px;display:inline-flex;
  transition:transform .14s ease;transform:rotate(90deg)}
.chat-папка-открыть[aria-expanded="false"] .chat-папка-стрелка{transform:rotate(0)}
.chat-папка-стрелка svg{width:14px;height:14px;fill:none;stroke:currentColor;
  stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.chat-папка-плюс,.chat-папка-убрать{flex:0 0 auto;width:var(--h-btn-sm);height:var(--h-btn-sm);
  min-height:var(--h-btn-sm);padding:0;border:0;background:none;color:var(--muted);
  border-radius:var(--radius-xs)}
.chat-папка-плюс{font-size:15px;line-height:1}
/* Крестик держит место всегда, но выходит по наведению: удаление необратимо,
   и постоянный крестик у каждой папки приглашает нажать его случайно. «+»
   спрятать так же нельзя — до него не добраться пальцем, и глазами его нет. */
.chat-папка-убрать{visibility:hidden}
.chat-папка:hover .chat-папка-убрать,.chat-папка:focus-within .chat-папка-убрать{visibility:visible}
.chat-папка-плюс:hover{color:var(--accent);background:var(--control-hover)}
.chat-папка-убрать:hover{color:var(--bad);background:var(--control-hover)}
/* Сдвиг ровно на стрелку: вложенный разговор должен читаться принадлежащим
   папке выше, а не отдельным списком. Рамка внутри рамки на 380 px делает из
   полосы лесенку коробок. */
.chat-item-вложен{margin-left:14px}
.chat-вне-папок{margin:8px 0 2px;padding:0 6px;font-size:12px;font-weight:660;
  letter-spacing:.04em;text-transform:uppercase}
/* Дата последней активности — у имени, справа, бледнее имени на ступень. */
.chat-item-когда{flex:0 0 auto;margin-left:auto;padding-left:8px;font-style:normal;
  font-size:12px;font-weight:400;color:var(--muted);font-variant-numeric:tabular-nums}
.chat-item-open b{display:flex;align-items:baseline;gap:0;min-width:0}
/* Точка «здесь идёт работа»: цвет акцентный, а не красный — работа не беда. */
.chat-item-работа{flex:0 0 auto;width:7px;height:7px;margin-right:6px;
  border-radius:var(--radius-circle);background:var(--accent);display:inline-block}
@media(prefers-reduced-motion:no-preference){
  .chat-item-работа{animation:работа-дышит 1.4s ease-in-out infinite}}
@keyframes работа-дышит{0%,100%{opacity:1}50%{opacity:.35}}

.toast{padding:10px 12px;border-radius:var(--radius);background:var(--card);
  border:1px solid var(--line);box-shadow:0 8px 28px rgba(58,61,64,.14);
  font-size:13px;line-height:1.42;color:var(--text)}
.toast-bad{border-color:var(--bad);color:var(--bad)}
/* Вид уведомления по типу события (ТЗ 10.09.2026, пункт 9). Цветом красится
   только край и значок: залитая карточка на пол-экрана — то, от чего владелец
   и просил уйти. */
.toast-good{border-color:var(--good)}
.toast-good .toast-ico{color:var(--good)}
.toast-file{border-color:var(--accent-3)}
.toast-file .toast-ico{color:var(--accent)}
.toast-queue{border-color:var(--accent-3)}
.toast-queue .toast-ico{color:var(--accent)}
.toast-bad .toast-ico{color:var(--bad)}
.toast-ico{flex:0 0 auto;width:18px;height:18px;display:inline-flex;align-items:center;
  justify-content:center;margin-top:1px;color:var(--muted)}
.toast-ico.hidden{display:none}
.toast-ico svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.9;
  stroke-linecap:round;stroke-linejoin:round}
/* Текст и крестик в одну строку. Крестик появляется только у отказа: обычное
   событие уходит само, и закрывать там нечего — лишняя кнопка на каждом
   уведомлении читалась бы как «тут что-то не так». */
.toast{display:flex;align-items:flex-start;gap:8px}
/* 32 — из шкалы высот интерактива, и одна `height` её не даёт: у кнопок панели
   стоит `min-height:var(--h-btn)` (38), а min-height всегда сильнее height.
   Замер 10.09.2026 показал крестик 24×38 — прямоугольник вместо квадрата.
   Отрицательные поля держат высоту сообщения прежней (40 px): без них кнопка
   растила карточку до 52. */
.toast-close{flex:0 0 auto;width:32px;height:32px;min-width:32px;min-height:32px;
  display:inline-flex;align-items:center;justify-content:center;padding:0;
  margin:-6px -6px -6px 0;
  border:0;background:none;color:inherit;cursor:pointer;border-radius:var(--radius-xs)}
.toast-close svg{width:14px;height:14px}
.toast-close:hover{background:var(--line)}
@media(prefers-reduced-motion:no-preference){.toast{animation:тост-въезд .18s ease-out}}
@keyframes тост-въезд{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* --- Итог и границы (артборд Result) ------------------------------------ */
#tab-agent .result-title{font-size:14px;font-weight:600;letter-spacing:-.01em;color:var(--text)}
#tab-agent .result-ico{width:18px;height:18px;flex:0 0 auto;color:var(--good);fill:none;
  stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
/* Таблица первых строк: три колонки, длинное значение подрезается многоточием,
   а не растягивает панель вбок. */
#tab-agent .result-table{border:1px solid var(--line);border-radius:var(--radius-sm);overflow:hidden}
#tab-agent .result-row{display:grid;grid-template-columns:1.2fr 1fr 1.4fr;gap:8px;
  padding:7px 10px;font-size:13px;line-height:1.4;border-top:1px solid var(--line)}
#tab-agent .result-row:first-child{border-top:0}
#tab-agent .result-row span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#tab-agent .result-head{color:var(--soft);font-weight:600;background:var(--bg-2)}
#tab-agent .result-more{padding:7px 10px;border-top:1px solid var(--line);
  font-size:13px;color:var(--muted)}
#tab-agent .result-limits{padding-top:10px;border-top:1px solid var(--line)}
#tab-agent .result-limits-list{margin:0;padding-left:16px;font-size:13px;line-height:1.45;
  color:var(--muted)}
#tab-agent .result-limits-list li{margin:4px 0}
#tab-agent .result-actions .grow{flex:1 1 0}

/* --- Ход работы (артборд Running) --------------------------------------- */
#tab-agent .run-title{font-size:14px;font-weight:600;letter-spacing:-.01em;color:var(--text)}
#tab-agent .run-bar{height:6px;border-radius:var(--radius-pill);background:var(--bg-2);overflow:hidden}
#tab-agent .run-bar i{display:block;height:100%;border-radius:var(--radius-pill);background:var(--accent);
  transition:width .3s ease}
/* Счётчики одной строкой: сеткой из пяти ячеек они занимали пол-экрана и
   спорили с полосой за внимание. */
#tab-agent .agent-runtime-stats{display:flex;flex-wrap:wrap;gap:4px 12px;
  font-size:13px;color:var(--muted);background:none;padding:0;border:0}
#tab-agent .agent-runtime-stats span{display:inline;background:none;padding:0;border:0}
#tab-agent .agent-runtime-stats b{color:var(--text);font-weight:600;margin-left:2px}
#tab-agent .run-note{align-items:flex-start;padding-top:10px;border-top:1px solid var(--line);
  font-size:13px;line-height:1.42;color:var(--muted)}
#tab-agent .run-note-ico{width:16px;height:16px;flex:0 0 auto;margin-top:1px;color:var(--accent);
  fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
#tab-agent .run-actions .grow{flex:1 1 0}
@media(prefers-reduced-motion:reduce){#tab-agent .run-bar i{transition:none}}

/* --- План до действий (артборд Plan) ------------------------------------ */
/* Шаги — нумерованные кружки, а не маркеры списка: в эталоне номер стоит слева
   отдельным знаком, и под каждым шагом видно, чем он обойдётся странице. */
#tab-agent .plan-title{font-size:15px;font-weight:600;letter-spacing:-.01em;
  line-height:1.35;color:var(--text)}
/* Между шагами 12 px, хотя в эталоне здесь 10: у него в отступах разнобой
   (3, 6, 7, 8, 9, 10, 11, 12), а панель держит одну шкалу — именно этот
   разнобой владелец и увидел как «всё разное». Расхождение в 2 px глазом
   не читается, а исключение из шкалы читается сразу. */
#tab-agent .agent-plan-list{list-style:none;margin:0;padding:0;counter-reset:шаг;
  display:flex;flex-direction:column;gap:12px}
#tab-agent .agent-plan-list li{display:grid;grid-template-columns:22px 1fr;
  column-gap:8px;row-gap:0;align-items:start;margin:0}
#tab-agent .agent-plan-list li::before{counter-increment:шаг;content:counter(шаг);
  width:22px;height:22px;border-radius:var(--radius-circle);border:1.5px solid var(--line);
  display:flex;align-items:center;justify-content:center;font-size:13px;
  font-weight:600;color:var(--soft)}
#tab-agent .agent-plan-list li b,#tab-agent .agent-plan-list li span{grid-column:2}
#tab-agent .agent-plan-list li b{display:block;font-size:13px;font-weight:400;
  line-height:1.45;color:var(--text)}
#tab-agent .agent-plan-list li span{display:block;margin-top:2px;font-size:13px;
  line-height:1.42;color:var(--muted)}
/* Неснимаемые границы: отделены чертой, как в эталоне, и читаются как обещание,
   а не как предупреждение об ошибке. */
#tab-agent .plan-limits{align-items:flex-start;padding-top:10px;
  border-top:1px solid var(--line);font-size:13px;line-height:1.42;color:var(--muted)}
#tab-agent .plan-limits-ico{width:16px;height:16px;flex:0 0 auto;margin-top:1px;
  color:var(--good);fill:none;stroke:currentColor;stroke-width:1.7;
  stroke-linecap:round;stroke-linejoin:round}
#tab-agent .plan-actions .grow{flex:1 1 0}

/* --- Варианты «как сделать» (артборд Assist) ---------------------------- */
/* Строка с кружком, а не кнопка-таблетка: это выбор способа, после которого
   ещё нужно нажать «Дальше». Кнопки читались как «нажал — и поехали». */
/* Пересказ задачи — обычный текст, а не заголовок: это реплика, её читают,
   а не сканируют. Раньше стоял <b> и получалась жирная простыня в шесть строк. */
.assist-said{font-size:13px;line-height:1.45;color:var(--text);font-weight:400}
.assist-options{display:flex;flex-direction:column;gap:6px}
.assist-option{display:flex;align-items:flex-start;gap:8px;width:100%;text-align:left;
  padding:10px 11px;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--card);
  color:var(--text);cursor:pointer;box-shadow:none;transform:none;min-height:0}
.assist-option:hover{border-color:var(--accent)}
.assist-option.current{border:1.5px solid var(--accent);background:var(--accent-soft)}
.assist-dot{width:17px;height:17px;border-radius:var(--radius-circle);border:1.5px solid var(--soft);
  flex:0 0 auto;margin-top:1px}
.assist-option.current .assist-dot{border:5px solid var(--accent)}
.assist-body{display:flex;flex-direction:column;min-width:0}
.assist-name{font-size:13px;font-weight:600;line-height:1.45;color:var(--text)}
.assist-detail{margin-top:2px;font-size:13px;line-height:1.42;color:var(--muted);font-weight:400}
.assist-actions .grow{flex:1 1 0}

/* --- Предложение по странице (артборд PageOffer) ------------------------ */
/* Плитки задач: две колонки, значок сверху, название и одна строка пояснения.
   Прежние правила лежали в четырёх слоях и превращали их то в узкие карточки
   по 88 px, то в таблетки без пояснения — поэтому вид собран здесь, ниже всех. */
/* Плитка компактная: значок стоит В СТРОКЕ с названием, а не над ним.
   Владелец 04.09.2026: «много пустоты рядом со значком и по бокам, хочется
   компактнее видеть все варианты». Прежняя плитка занимала 96 px высоты, из
   них треть — пустое поле справа от значка 22×22. */
#tab-agent .quick-actions .action-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:0}
#tab-agent .quick-actions .action-card{display:grid;grid-template-columns:auto minmax(0,1fr);
  column-gap:8px;row-gap:4px;align-items:center;flex:1 1 auto;min-height:0;padding:9px 10px;
  border-radius:var(--radius-xs);background:var(--card);border:1px solid var(--line);
  color:var(--text);text-align:left;cursor:pointer;box-shadow:none;transform:none}
#tab-agent .quick-actions .action-card:hover{border-color:var(--accent);background:var(--accent-soft)}
#tab-agent .quick-actions .action-ico{grid-column:1;grid-row:1;display:grid;place-items:center;
  width:18px;height:18px;border-radius:0;background:transparent;margin:0;color:var(--accent)}
#tab-agent .quick-actions .action-ico svg{width:18px;height:18px}
#tab-agent .quick-actions .action-name{grid-column:2;grid-row:1;margin-top:0;font-size:13px;
  font-weight:600;letter-spacing:-.01em;line-height:1.25;color:var(--text)}
#tab-agent .quick-actions .action-sub{grid-column:2;grid-row:2;display:block;margin-top:0;
  font-size:12px;line-height:1.35;color:var(--muted);white-space:normal;overflow-wrap:anywhere}
#tab-agent .quick-actions .action-name{white-space:normal}
/* Заголовок списка задач — как в эталоне («ВОТ ЧТО УМЕЮ ЗДЕСЬ»). Прежний слой
   прятал его целиком, и над плитками оставался один значок без слов. */
#tab-agent .quick-actions .label{display:inline-block}
/* Реплика владельца — короткий пузырь у правого края, как в эталоне. Заливка
   --btn, а не --accent: белый текст на акценте даёт 4,06 и не проходит порог. */
#tab-agent .you{width:fit-content;max-width:250px;margin-left:auto;background:var(--btn);
  color:var(--ink-on-accent);border-radius:var(--radius) var(--radius) var(--radius-xs) var(--radius);padding:9px 12px;
  font-size:13px;line-height:1.4}
/* Реплики переписки — по тем же артбордам (Assist, Plan, Buy). Владелец
   получает тот же пузырь, что и .you: одна форма реплики на весь экран.
   Ответ — белая карточка во всю ширину ленты. Аватарок эталон не рисует. */
#tab-agent .agent-msg{display:block;padding:0;border:0;background:none}
#tab-agent .agent-msg.user{width:fit-content;max-width:250px;margin-left:auto;
  background:var(--btn);color:var(--ink-on-accent);border-radius:var(--radius) var(--radius) var(--radius-xs) var(--radius);
  padding:9px 12px}
/* Место справа под знак «⋮»: он стоит НА первой строке ответа, у правого
   края, и не отнимает у карточки отдельной строки (ТЗ владельца 12.09.2026,
   п. 8). Без этого запаса длинная первая строка уезжала бы под знак. */
#tab-agent .agent-msg.assistant{position:relative;padding:11px 12px;padding-right:38px;
  border:1px solid var(--line);
  border-radius:var(--radius);background:var(--card);box-shadow:var(--shadow)}
/* `margin` у абзаца не задаётся: шаг между блоками ответа один и живёт в
   правиле ритма ниже. Пока здесь стояло `margin:0`, оно перебивало ритм по
   специфичности (тип в селекторе), и абзац после списка прилипал к нему. */
/* Кегль тела ответа ОДИН — 14. До 14.09.2026 абзац был 13, а пункт списка
   14: в одном ответе текст прыгал между двумя размерами, и владелец прочитал
   это как «ответ дал разными шрифтами и размерами». Плотнее остаётся только
   таблица (13) — это осознанная плотность данных, а не разнобой. */
#tab-agent .agent-msg p{font-size:var(--fs-14);line-height:1.45;white-space:pre-wrap;
  overflow-wrap:anywhere}
/* Ритм ответа (ТЗ 13.09.2026, п. 7: «странные пробелы… нижние строчки
   прислоняются близко к другим»). Дело не в межстрочии — оно ровное (замер:
   шаги 18 и 18 при кегле 13). Дело в том, что каждый вид блока нёс свой
   отступ: у абзаца 0, у списка 6 сверху, у заголовка 8/2, у таблицы 6. Два
   абзаца подряд стояли вплотную, а после списка появлялся провал. Шаг между
   блоками теперь один и задан ЗДЕСЬ, а не в каждом правиле по-своему. */
#tab-agent .agent-msg>*{margin:0}
#tab-agent .agent-msg>*+*{margin-top:8px}
#tab-agent .agent-msg>.msg-actions{margin-top:0}
#tab-agent .agent-msg.user p{color:var(--ink-on-accent)}
#tab-agent .agent-msg.assistant p{color:var(--text)}
/* Самопроверка итога: заголовок отдельной строкой, пояснение под ним. */
#tab-agent #agentResultCheck{display:block;font-size:13px;line-height:1.42;color:var(--text)}
#tab-agent #agentResultCheck>b{display:block;font-size:13px}
#tab-agent .проверка-строка{margin-top:4px;color:var(--muted)}
#tab-agent #agentResultCheck ul{margin:4px 0 0;padding-left:18px;color:var(--muted)}
#tab-agent .offer-links .link-btn{background:none;border:0;padding:2px;color:var(--accent-2);
  font-size:13px;font-weight:600;cursor:pointer;min-height:0;box-shadow:none}
#tab-agent .offer-links .link-btn:hover{text-decoration:underline}

/* ─ Списки,полосы и поля: артборды Tabs,Data и History ───────────────────────────── */
/* Один и тот же вид у «Вкладок» и «Данных»: строка со значком и подписью,полосы-переключатели,поле поиска. Второй копии этих правил быть не должно. */
#tab-tabs .section-h1,#tab-data .section-h1{font-size:20px;font-weight:800;letter-spacing:-.02em;margin:0;color:var(--text)}
#tab-tabs .seg,#tab-history .seg,#tab-data .seg,#tab-settings .seg{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:4px;
  padding:4px;border-radius:var(--radius-sm);background:var(--bg-2)}
#tab-tabs .seg-i,#tab-history .seg-i,#tab-data .seg-i,#tab-settings .seg-i{min-height:32px;padding:0 8px;border:0;border-radius:var(--radius-xs);background:none;
  font-size:13px;font-weight:600;color:var(--muted);cursor:pointer}
#tab-tabs .seg-i.on,#tab-history .seg-i.on,#tab-data .seg-i.on,#tab-settings .seg-i.on{background:var(--card);color:var(--text);box-shadow:var(--shadow)}
#tab-tabs .field,#tab-history .field,#tab-data .field{border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--card);
  padding:8px 12px;display:flex;align-items:center}
#tab-tabs .field-ico,#tab-history .field-ico,#tab-data .field-ico{width:15px;height:15px;flex:0 0 auto;fill:none;stroke:var(--soft);
  stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
#tab-tabs .field-input,#tab-history .field-input,#tab-data .field-input{border:0;background:none;padding:0;min-height:0;font-size:13px;
  color:var(--text);box-shadow:none}
#tab-tabs .field-input:focus,#tab-history .field-input:focus,#tab-data .field-input:focus{outline:none;box-shadow:none}
#tab-tabs .tab-groups,#tab-history .tab-groups,#tab-data .tab-groups{display:flex;flex-direction:column;gap:8px}
#tab-tabs .group-head,#tab-history .group-head,#tab-data .group-head{align-items:center;margin-top:4px}
#tab-tabs .group-head .label,#tab-history .group-head .label,#tab-data .group-head .label{margin:0}
#tab-tabs .hr,#tab-history .hr,#tab-data .hr{height:1px;background:var(--line)}

#tab-tabs .gap6,#tab-history .gap6,#tab-data .gap6{gap:6px}
#tab-tabs .browser-tab,#tab-history .browser-tab,#tab-data .browser-tab{display:flex;align-items:center;gap:8px;padding:10px;
  border:1px solid var(--line);border-radius:var(--radius);background:var(--card);cursor:pointer}
#tab-tabs .browser-tab.locked,#tab-history .browser-tab.locked,#tab-data .browser-tab.locked{cursor:default;opacity:.72}
#tab-tabs .tab-nomark,#tab-history .tab-nomark,#tab-data .tab-nomark{width:18px;height:18px;flex:0 0 auto}
/* Буква на значке всегда белая: фон значка задаётся не темой,а адресом сайта,и «чернила на акценте» в тёмной теме становятся почти чёрными — на тёмном
   значке это давало контраст 3,12 при норме 4,5. */
#tab-tabs .tab-mark{width:20px;height:20px;border-radius:var(--radius-xs);color:var(--ink-on-accent);
  font-size:13px;font-weight:700;display:flex;align-items:center;justify-content:center;flex:0 0 auto}
#tab-tabs .tab-title,#tab-history .tab-title,#tab-data .tab-title{display:block;font-size:13px;font-weight:600;color:var(--text)}
#tab-tabs .tab-url,#tab-history .tab-url,#tab-data .tab-url{display:block;font-size:12px;color:var(--muted)}
#tab-tabs .chip,#tab-history .chip,#tab-data .chip{display:inline-flex;align-items:center;padding:6px 10px;border-radius:var(--radius-badge);
  background:var(--bg-2);font-size:12px;font-weight:500;color:var(--muted);flex:0 0 auto}
#tab-tabs .link-btn,#tab-history .link-btn,#tab-data .link-btn{background:none;border:0;padding:2px 4px;min-height:var(--h-btn-sm);color:var(--accent-2);
  font-size:13px;font-weight:600;cursor:pointer;box-shadow:none}
#tab-tabs .link-btn:hover,#tab-history .link-btn:hover,#tab-data .link-btn:hover{text-decoration:underline}
#tab-tabs .selected-card,#tab-history .selected-card,#tab-data .selected-card{position:sticky;bottom:0;margin-top:8px}

/* ─ Оболочка: собрано Инструменты/этап2_оболочка.py ─ */
/* Геометрия — из эталона: шапка 52,ряд меню 54,поля 14 с обеих сторон.
   Одинаковые поля у шапки и меню и дают ту симметрию,которой не хватало. */
body{display:flex;flex-direction:column;min-height:100vh;padding:0}
.topbar{order:1;flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;
  gap:8px;height:52px;padding:0 14px;background:var(--card);border-bottom:1px solid var(--line);
  position:sticky;top:0;z-index:30}
main{order:2;flex:1 1 auto;min-height:0;overflow-y:auto;padding:14px 14px 18px;max-width:none;
  display:flex;flex-direction:column}
/* Раздел занимает всю высоту содержимого: иначе поле ввода уезжает вверх,а под ним остаётся пустая полоса. */
/* `flex:1 1 auto` вместе с `min-height:0` позволяли разделу сжаться до нуля, а
   содержимому — вывалиться наружу: замер 03.09.2026 на «Обзоре» дал высоту
   раздела 1 px при содержимом на 1379. Из-за этого ни нижний отступ `main`, ни
   распорка в конец прокрутки не попадали, и последний блок упирался в полосу
   разделов ровно в 0 px — жалоба владельца «нижние блоки слипаются с меню».
   Раздел больше не сжимается: `flex-shrink:0`. */
main>.panel.active{flex:1 0 auto;min-height:0}
/* Сообщения панели стоят между содержимым и меню и занимают собственное
   место. Прежде они висели `position:fixed` над нижним краем и накрывали
   кнопку «Поставить задачу»: сообщение о работе перекрывало саму работу. */
#toast{order:3;flex:0 0 auto;position:static;margin:0 14px 8px}
/* Колонок ровно столько, сколько разделов: зашитая пятёрка уронила шестой
   раздел («Обзор») во вторую строку — полоса стала двухэтажной. Авто-колонки
   переживают добавление раздела, зашитое число — нет. */
.tabs{order:4;flex:0 0 auto;display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:0;
  /* minmax(0,…), а не 1fr: у 1fr нижняя граница — ширина содержимого, и
     подпись «Настройки» на 13 px снова растянула свою колонку до 69 px
     против 66 у соседей (замер прогона 31.08.2026). */
  padding:0 14px;background:var(--card);border-top:1px solid var(--line);position:static}

/* Логотип — кнопка на главную. Сбрасываем фон и рамку кнопки: выглядит
   логотипом, ведёт себя кнопкой (и получает фокус с клавиатуры). */
/* Знак не сжимается: при 400 px длинная плашка состояния («служебная
   страница» — 143 px) отбирала у кнопки 5 px, и слово «Vkladka» вылезало за её
   край. Уступать место обязано второстепенное, а имя программы — нет. */
.brand-wrap{display:flex;align-items:center;gap:8px;flex:0 0 auto;
  background:none;border:0;padding:0;margin:0;font:inherit;cursor:pointer;
  border-radius:var(--radius-xs);text-align:left}
.brand-wrap:hover .brand-name{color:var(--accent)}
.brand-wrap:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.brand-name{font-size:15px;font-weight:700;letter-spacing:-.02em;color:var(--text);white-space:nowrap}
/* Знак — svg,который красится currentColor,поэтому в тёмной теме он берёт
   светлый акцент и не выпадает из палитры. */
/* Знак — такой же элемент полосы, как соседние значки, и берёт их
   высоту. По рендеру кнопки шапки 38 px, а не 34: правило .icon-btn
   перебито дальше по файлу, и правка «по исходнику» дала бы знак на
   ступень меньше соседей. 26 px рядом с 38 читались как «логотип
   меньше всех» — то же замечание владельца, что и про веб 31.08.2026.
   В строке текста знак берёт кегль строки: класс «в-строке». */
.brand-mark{width:38px;height:38px;display:block;flex:0 0 auto;color:var(--accent)}
.brand-mark.в-строке{width:15px;height:15px}
.top-actions{display:flex;align-items:center;gap:8px;min-width:0}
.site-state{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:var(--radius-badge);
  background:var(--bg-2);border:1px solid var(--line);font-size:12px;color:var(--muted);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:190px;min-width:0}
.site-state span{overflow:hidden;text-overflow:ellipsis}
.status-light{width:6px;height:6px;border-radius:var(--radius-circle);background:var(--soft);flex:0 0 auto}
/* Состояние страницы раньше красилось из скрипта числами (#e9f8f1 / #fff3df) —
   в тёмной теме они оставались светлыми. Теперь это класс и токены. */
.site-state.ok{background:var(--good-soft);border-color:var(--good-soft);color:var(--good)}
.site-state.ok .status-light{background:var(--good-fill)}
.site-state.warn{background:var(--warn-soft);border-color:var(--warn-soft);color:var(--warn)}
.site-state.warn .status-light{background:var(--warn-fill)}

/* Пункт меню: полоса сверху вместо заливки — так активный раздел виден,а высота ряда не скачет. Поля 2 px по бокам — как в эталоне: при 4 px
   «Настройки» не влезали в свою пятую часть и колонка становилась шире
   остальных,ряд переставал быть симметричным. */
.tab{display:flex;flex-direction:column;align-items:center;justify-content:center;
  min-height:54px;padding:5px 2px;background:transparent;border:0;border-top:2px solid transparent;
  border-radius:0;color:var(--muted);font-size:13px;font-weight:500;cursor:pointer;
  box-shadow:none;transform:none;letter-spacing:-.02em;white-space:nowrap}
/* Отбивка подписи от значка задана полем сверху — как в эталоне. Через
   расстояние между элементами её задавать нельзя: 2 px выпадают из шкалы. */
.tab span{margin-top:2px}
.tab .tab-icon{display:flex;align-items:center;justify-content:center;line-height:1;color:inherit}
.tab .tab-icon svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;
  stroke-linecap:round;stroke-linejoin:round}
.tab:hover{background:transparent;color:var(--text)}
.tab.active{border-top-color:var(--accent);color:var(--accent);font-weight:600;background:transparent;
  box-shadow:none}
.tab.active .tab-icon{color:var(--accent)}
.tab:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.rail-mark,.rail-foot{display:none}
/* Узкий режим: см. УЗКО и ПОЛЕ_УЗКОЕ выше. */
/* На 320 px подпись «История» на 13 px требует 63 px, а колонка даёт 61 —
   и её резало посреди буквы (замер прогона 31.08.2026). Подписи вкладок —
   служебные, 12 px для них своя ступень шкалы, а не отступление от неё. */
/* Узкая панель: шесть подписей в 13 px не помещаются — замер дал «Настройки»
   65 px против колонки 55 px на 360. Отдаём подписям поля полосы и ступень
   шкалы вниз, а не прячем их: без подписи новичок не узнаёт раздел.
   Блок стоит ПОСЛЕ .tab: медиазапрос специфичности не добавляет, и раньше
   по файлу он проигрывал бы обычному правилу. */
@media(max-width:430px){.tab{padding:5px 1px;font-size:12px}}
/* Ещё уже — подписи не помещаются даже в 12 px («Настройки» 60 px против
   колонки 59). Наложенный или обрезанный текст хуже честной иконки, поэтому
   ниже 380 px полоса становится значковой; название кнопки остаётся в
   aria-label и всплывающей подсказке, цель нажатия — прежние 54 px. */
/* Ниже 420 px шесть подписей не помещаются даже в 12 px («Настройки» 60 px
   против колонки 59): наложенный текст хуже честного значка, имя остаётся
   в aria-label и подсказке. Высоту не трогаем — ряд разделов живёт по
   своей ступени шкалы (--h-nav 54). */
@media(max-width:420px){.tab span:not(.tab-icon){display:none}}
@media(max-width:340px){.tabs{padding:0 8px}.tab{padding:5px 0;font-size:12px}}

/* Пустая лента сообщений тянулась во всю высоту и давала белую полосу
   примерно в треть экрана — на первом же экране,который видит человек.
   Пока сообщений нет,лента не растёт. :empty здесь не подходит: внутри
   остаются переводы строк из разметки. */
#agentChatMessages:not(:has(*)){flex:0 0 auto;min-height:0}

/* ─ Экран «Данные»: значок типа файла и кнопки съёмки ──────────────────────── */
/* 11px вместо 9px из артборда: 9 не входит в шкалу радиусов проекта, а
   разнобой в скруглениях виден рядом со строками вкладок. */
#tab-history .file-mark,#tab-data .file-mark{width:30px;height:30px;border-radius:var(--radius-sm);display:flex;align-items:center;
  justify-content:center;flex:0 0 auto}
#tab-history .file-mark svg,#tab-data .file-mark svg{width:16px;height:16px}
#tab-data .icb{width:38px;height:38px;min-height:38px;padding:0;border-radius:var(--radius-xs);
  border:1px solid var(--line);background:var(--card);display:flex;align-items:center;
  justify-content:center;cursor:pointer;flex:0 0 auto}
#tab-data .icb svg{width:17px;height:17px;fill:none;stroke:var(--muted);stroke-width:1.7;
  stroke-linecap:round;stroke-linejoin:round}
/* Идёт запись — кнопка обязана отличаться от «не идёт» не только подписью. */
#tab-data .icb.busy{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 12%,var(--card))}
#tab-data .icb.busy svg{stroke:var(--accent)}
#tab-data #dataManual summary{cursor:pointer;font-size:13px;font-weight:600;color:var(--accent-2)}
#tab-data .row-menu{position:relative;flex:0 0 auto}
#tab-data .row-dots{width:28px;height:28px;min-height:28px;padding:0;border:0;border-radius:var(--radius-xs);
  background:none;display:flex;align-items:center;justify-content:center;cursor:pointer}
#tab-data .row-dots svg{width:15px;height:15px;fill:var(--soft)}
#tab-data .row-dots:hover{background:var(--bg-2)}
#tab-data .row-menu-list{position:absolute;right:0;top:30px;z-index:5;display:flex;
  flex-direction:column;min-width:132px;padding:4px;border:1px solid var(--line);
  border-radius:var(--radius-sm);background:var(--card);box-shadow:var(--shadow)}
#tab-data .row-menu-list button{min-height:32px;padding:0 8px;border:0;border-radius:var(--radius-xs);
  background:none;text-align:left;font-size:13px;color:var(--text);cursor:pointer}
#tab-data .row-menu-list button:hover{background:var(--bg-2)}
#tab-data .row-menu-list button.опасно{color:var(--bad)}
/* ─ История: строка разговора ─────────────────────────────────────────────── */
#tab-history .talk{width:100%;text-align:left;align-items:flex-start}
#tab-history .talk.current{border-color:var(--accent)}
#tab-history .talk-when{font-size:13px;color:var(--muted);white-space:nowrap;flex:0 0 auto}
#tab-history .talk-mark{font-size:13px;color:var(--warn-ink,var(--muted));white-space:nowrap;flex:0 0 auto}
#tab-history #historyLegacy summary{cursor:pointer;font-size:13px;font-weight:600;color:var(--accent-2)}

/* ─ Настройки: оглавление и вложенные страницы (артборды Settings/Models) ─── */
#tab-settings .section-h1{font-size:20px;font-weight:800;letter-spacing:-.02em;margin:0;color:var(--text)}
#tab-settings .subhead{display:flex;align-items:center;gap:8px}
#tab-settings .subhead-t{font-size:15px;font-weight:700;color:var(--text);min-width:0}
#tab-settings .back{width:32px;height:32px;min-height:32px;padding:0;border-radius:var(--radius-xs);
  border:1px solid var(--line);background:var(--card);font-size:15px;line-height:1;cursor:pointer}
#tab-settings .nav-row,#tab-overview .nav-row{display:flex;align-items:center;gap:8px;width:100%;text-align:left;
  padding:10px;border:1px solid var(--line);border-radius:var(--radius);background:var(--card);cursor:pointer}
#tab-settings .nav-row .tab-title,#tab-overview .nav-row .tab-title{display:block;font-size:13px;font-weight:600;color:var(--text)}
#tab-settings .nav-row .tab-url,#tab-overview .nav-row .tab-url{display:block;font-size:12px;color:var(--muted)}

/* Стрелка «дальше» — часть подписи строки, а не украшение: цвет тот же,
   что у пояснения, иначе не добирает контраста. */
#tab-settings .row-go{color:var(--muted);flex:0 0 auto}
#tab-settings .model-row.current{border-color:var(--accent)}
#tab-settings .always-list{margin:0;padding-left:18px;color:var(--text);font-size:13px}
#tab-settings .always-list li{margin:4px 0}
#tab-settings .chip{flex:0 0 auto}

/* ─ Шкала размеров интерактива ─────────────────────────────────────────────
   Правил для полей и кнопок в файле несколько, они писались в разное время и
   давали разную высоту одного и того же элемента: поля 41, быстрые действия
   36, ссылки-кнопки 28, кнопка озвучки 26. Замер АУДИТ_ВИДА показал 36 таких
   мест. Здесь единственное место, где высота интерактива называется явно, —
   из шкалы эталона: 32 (мелкое), 38 (обычное). Блок стоит последним намеренно:
   он обязан выигрывать у частных правил выше. */
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
select {
  min-height: var(--h-field);
  height: var(--h-field);
  padding-top: 0;
  padding-bottom: 0;
}

/* Многострочное поле живёт по своим правилам: у него растёт высота. */
textarea { height: auto; }

.quick { min-height: var(--h-btn); }

.link-btn,
.voice-out { min-height: var(--h-btn-sm); }

/* ─ Границы полей: их видно, а не угадывают ────────────────────────────────
   Фон поля совпадает с фоном карточки, поэтому поле опознаётся только рамкой.
   При общей --line край давал 1.2:1 — WCAG 1.4.11 требует 3:1 для таких
   границ. --line-strong даёт 3.28 в светлой теме и 3.10 в тёмной. */
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
select,
textarea { border-color: var(--line-strong); }

/* ─ Сетки без сирот ────────────────────────────────────────────────────────
   Нечётный последний элемент сетки в две колонки оставался «осиротевшим»:
   половина ряда занята, половина пуста — замер АУДИТ_ВИДА видит это как
   перекос полей (слева 0, справа 348). Растягиваем его на всю строку. */
.mission-os-grid > :last-child:nth-child(odd),
.help-grid > :last-child:nth-child(odd),
.mission-guidance-grid > :last-child:nth-child(odd),
.mission-do-dont > :last-child:nth-child(odd),
.quick-grid > :last-child:nth-child(odd),
.settings-grid > :last-child:nth-child(odd),
.stats-grid > :last-child:nth-child(odd) { grid-column: 1 / -1; }

/* Заголовок сворачиваемого блока читается как его шапка, а не как часть
   карточки: подложка плюс линия снизу, когда блок раскрыт. */
.mission-os-shell[open] > .mission-os-shell-summary { border-bottom: 1px solid var(--line); }

/* ─ Столбцы плана: карточка на столбец (артборд WebParser) ───────────────
   Столбец — не ярлык, а решение: видно имя, зачем он нужен и как убрать.
   Кнопка «убрать» размером с настоящую цель нажатия, а не крестик в
   полсимвола: WCAG 2.2 требует 24×24, шкала эталона даёт ближайшие 32. */
.col-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
/* Последняя карточка не остаётся сиротой в полряда: занимает ряд целиком.
   И пояснение держит место под две строки — иначе соседи по ряду разной
   высоты, а это и есть «блоки отличаются по высоте». */
.col-grid>:last-child:nth-child(odd){grid-column:1 / -1}
.col-card{position:relative;display:flex;flex-direction:column;gap:4px;min-width:0;
  padding:10px 38px 10px 11px;border:1px solid var(--line);border-radius:var(--radius-xs);background:var(--bg-2)}
.col-card-name{font-size:var(--fs-13);font-weight:700;color:var(--text);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.col-card-why{font-size:var(--fs-12);color:var(--muted);min-height:32px;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ai-col-card{border-color:color-mix(in srgb,var(--accent) 34%,var(--line))}
.col-card-x{position:absolute;top:6px;right:6px;width:32px;height:32px;min-height:32px;
  padding:0;display:grid;place-items:center;border:0;background:transparent;
  color:var(--muted);font-size:var(--fs-15);line-height:1;border-radius:var(--radius-xs)}
.col-card-x:hover{background:var(--card);color:var(--text);transform:none;box-shadow:none}
#planColumnNew{flex:1 1 auto;min-width:0}

/* ─ Кадр страницы: снимок вкладки с рамками полей ────────────────────────
   Рамки заданы в долях окна, поэтому ужимаются вместе со снимком и остаются
   на своих полях при любой ширине панели. */
.frame-box{position:relative;border:1px solid var(--line-strong);border-radius:var(--radius-xs);overflow:hidden;background:var(--bg-2)}
.frame-box img{display:block;width:100%;height:auto}
.frame-marks{position:absolute;inset:0;pointer-events:none}
.frame-mark{position:absolute;border:2px solid var(--accent);border-radius:var(--radius-xs);
  background:color-mix(in srgb,var(--accent) 12%,transparent);pointer-events:auto}
.frame-mark.is-locked{border-color:var(--warn);border-style:dashed;background:transparent}
.frame-mark.is-active{box-shadow:0 0 0 3px var(--accent-3)}
.frame-list{display:flex;flex-direction:column;gap:6px}
.frame-row{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;
  min-height:38px;padding:8px 10px;border:1px solid var(--line);border-radius:var(--radius-xs);
  background:var(--card);text-align:left}
.frame-row.is-locked{border-style:dashed}
.frame-row.is-active{border-color:var(--accent)}
.frame-row-name{flex:1 1 auto;min-width:0;font-size:var(--fs-13);font-weight:600;color:var(--text);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.frame-row-note{flex:0 0 auto;font-size:var(--fs-12);color:var(--muted)}
.frame-row.is-locked .frame-row-note{color:var(--warn)}

/* ── Раскрытие перед первой отправкой ───────────────────────────────────────
   Лист снизу, а не карточка в ленте. Карточкой было измерено: на панели
   360 px текст помещался, а обе кнопки оказывались на 52 px ниже видимой
   части ленты — человек видел предупреждение и не видел, чем на него
   ответить. Здесь текст прокручивается, кнопки закреплены. */
.disclosure-sheet{position:fixed;left:0;right:0;bottom:0;z-index:46;
  display:flex;flex-direction:column;max-height:min(78vh,560px);
  background:var(--card);border-top:1px solid var(--line);
  box-shadow:0 -12px 32px rgba(8,12,22,.16)}
.disclosure-body{flex:1 1 auto;overflow-y:auto;padding:14px 14px 6px}
.disclosure-body ul{margin:0;padding-left:18px}
.disclosure-body li+li{margin-top:6px}
.disclosure-actions{padding:10px 14px 14px;border-top:1px solid var(--line);background:var(--card)}

/* ── Карточка плана в ленте ─────────────────────────────────────────────────
   Та же разметка, что была листом, но в потоке разговора: ширину задаёт
   колонка чата, а не экран. Кнопки ПЕРЕНОСЯТСЯ (`flex-wrap`), и это не
   украшение: на 380 px «Начать» и «Изменить» в одну строку не помещаются, а
   именно уехавшие кнопки и были причиной, по которой карточку когда-то
   заменили листом. */
.план-карточка{position:static;z-index:auto;max-height:none;box-shadow:none;
  border:1px solid var(--line);border-radius:var(--radius);margin-top:10px}
.план-карточка .disclosure-body{overflow:visible;padding:12px 14px 4px}
.план-карточка .disclosure-actions{flex-wrap:wrap;border-top:0;padding:8px 14px 12px;
  background:transparent;border-bottom-left-radius:var(--radius);border-bottom-right-radius:var(--radius)}
.план-карточка .disclosure-actions .btn{flex:0 1 auto}

/* ── Помощь ─────────────────────────────────────────────────────────────── */
/* Устроена как список чатов: затемнение плюс лист поверх экрана. Второй
   способ показа означал бы вторую вёрстку, которая разойдётся на первой правке. */
.help-backdrop{position:fixed;inset:0;z-index:44;background:rgba(8,12,22,.34)}
.help-sheet{position:fixed;top:0;right:0;bottom:0;z-index:45;width:min(94vw,420px);
  display:flex;flex-direction:column;background:var(--card);border-left:1px solid var(--line);
  box-shadow:-12px 0 32px rgba(8,12,22,.14)}
.help-head{display:flex;align-items:center;gap:8px;padding:12px 14px;border-bottom:1px solid var(--line)}
.help-head .wide{flex:1 1 auto}
.help-body{flex:1 1 auto;overflow-y:auto;padding:12px 14px 20px}
.help-q>summary{cursor:pointer;font-size:var(--fs-14);font-weight:640;min-height:32px;
  display:flex;align-items:center;justify-content:space-between;gap:8px;list-style:none}
.help-q>summary::-webkit-details-marker{display:none}
/* Вопрос без знака читается как обычный текст, и человек не понимает, что
   ответ вообще есть. Знак поворачивается — раскрыт вопрос или нет, видно. */
.help-q>summary::after{content:'';flex:none;width:7px;height:7px;margin-top:-3px;
  border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);
  transform:rotate(45deg);transition:transform .15s}
.help-q[open]>summary::after{margin-top:3px;transform:rotate(-135deg)}
.help-q>p{margin:6px 0 0}
.help-limits{margin:0;padding-left:18px;display:grid;gap:6px;font-size:var(--fs-13);color:var(--muted)}
/* Предпросмотр письма показывают целиком: обрезанный текст не доказывает,
   что наружу не уходит лишнее. */
.help-preview{margin:0;padding:10px;border:1px solid var(--line);border-radius:var(--radius-xs);
  background:var(--bg-2);font-size:var(--fs-12);line-height:1.45;white-space:pre-wrap;
  word-break:break-word;max-height:220px;overflow-y:auto}

/* Знакомство: та же карточка, что и остальные, с акцентным краем — оно
   не окно поверх экрана, чтобы не загораживать то, о чём рассказывает. */
.tour-card{border-color:var(--accent)}
/* Две колонки везде, включая узкую панель: владелец 04.09.2026 — «блоки
   с чего начать я бы сделал в шахматном порядке, не столбцом, а по 2».
   Прежнее ограничение `min-width:520px` пришло от подсказок приветствия, где
   подпись «Что можно с этой страницей» в половине ряда не помещалась; здесь
   подписи в два-три слова, и половины ряда им хватает — высота плиток
   меряется тестом, чтобы перенос не вырастил их выше ступени. Задач шесть
   ровно поэтому: пять оставляли сироту в последнем ряду. */
.start-chips{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.start-chips .chip:last-child:nth-child(odd){grid-column:1/-1}
/* Тот же вид, что у подсказок приветствия: глобальный .chip зелёный, и рядом
   с белыми подсказками готовые задачи «выпадали цветом». */
.start-chips .chip{display:flex;align-items:center;justify-content:center;text-align:center;
  min-height:var(--h-btn);border:1px solid var(--line);background:var(--card);color:var(--text);
  border-radius:var(--radius-xs);padding:8px 12px;font-size:13px;font-weight:600;cursor:pointer;
  /* Та же плитка, что в приветствии, — и тот же перенос подписи. */
  white-space:normal;overflow-wrap:anywhere;line-height:1.28}
.start-chips .chip:hover{background:var(--control-hover)}


/* ─ Иерархия кеглей (пункт 7 владельца, 31.08.2026) ───────────────────────
   До этого дня 613 из 750 надписей стояли на 12 px, и заголовок карточки
   отличался от её текста на один пиксель — экран читался как каша из мелкого.
   Роли: 12 — подписи, 13 — вторичное, 14 — основной текст (база документа),
   15 — заголовки. Задаётся здесь, в конце файла, чтобы перебить частные
   правила старых экранов, накопленные до введения шкалы. */
.card>.strong,.card .row>.strong,#tourTitle,.greeting-hi,.card-summary,
.plan-details>summary,.mission-help>summary{font-size:var(--fs-15);line-height:1.34}
/* Основной текст карточки — база документа, а не подпись. */
.card p,.card li,.agent-msg,.agent-say{font-size:var(--fs-14)}


/* Ход мыслей в ленте: одна строка, пока её не раскрыли. Раньше план шёл
   такой же карточкой, как ответ, и владелец читал одно и то же трижды. */
#tab-agent .agent-think{border:1px solid var(--line);border-radius:var(--radius);
  background:var(--bg-2);padding:8px 11px;color:var(--muted)}
#tab-agent .agent-think>summary{cursor:pointer;font-size:var(--fs-13);font-weight:600;
  color:var(--muted);list-style:none}
#tab-agent .agent-think>summary::-webkit-details-marker{display:none}
#tab-agent .agent-think>summary::before{content:"▸ ";color:var(--soft)}
#tab-agent .agent-think[open]>summary::before{content:"▾ "}
#tab-agent .agent-think ol{margin:6px 0 0;padding-left:20px;font-size:var(--fs-13)}
#tab-agent .agent-think li{margin:3px 0}


/* Расход под чатом: подпись, а не показатель — 12 px и приглушённый цвет.
   Крупные цифры здесь спорили бы с ответом модели за внимание. */
/* Расход — значок в нижнем ряду (ТЗ 13.09.2026). Кнопка-иконка той же роли и
   того же размера, что скрепка рядом: разнобой высот владелец видит сразу. */
#tab-agent .composer-spend{flex:0 0 auto;display:inline-flex;align-items:center;
  justify-content:center;padding:0;border:1px solid var(--line);border-radius:var(--radius-xs);
  background:var(--card);color:var(--muted);cursor:pointer}
/* Цифры не исчезли — они остаются подсказкой при наведении и читалке.
   `display:none` тут нельзя: читалка тогда не назовёт расход вовсе. */
.только-читалке{position:absolute;width:1px;height:1px;margin:-1px;padding:0;
  overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
#tab-agent .composer-spend:hover{background:var(--control-hover);color:var(--text)}
/* Разделитель в меню контекста: подпись группы, а не пункт. */
#composerCtxMenu .ctx-menu-sep{padding:7px 10px 3px;font-size:var(--fs-12);color:var(--soft);
  letter-spacing:0;font-weight:850;border-top:1px solid var(--line);margin-top:4px}


/* ─ Просмотр документа (пункты 3 и 9 владельца, 31.08.2026) ──────────────
   Оверлей поверх всего: в панели шириной 400 px место под документ можно
   взять только у остального экрана, а в окне так же ведут себя привычные
   человеку программы. */
.док-оверлей{position:fixed;inset:0;z-index:80;display:flex;align-items:center;justify-content:center;
  padding:16px;background:color-mix(in srgb,var(--text) 42%,transparent)}
.док-окно{display:flex;flex-direction:column;width:min(980px,100%);height:min(88vh,100%);
  background:var(--card-solid);border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:0 24px 60px rgba(15,23,42,.22);overflow:hidden}
.док-шапка{display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:12px 14px;border-bottom:1px solid var(--line);background:var(--card)}
.док-тело{flex:1 1 auto;min-height:0;overflow:auto;padding:14px;background:var(--bg)}
.док-подвал{padding:10px 14px;border-top:1px solid var(--line);background:var(--card)}
.док-текст{width:100%;min-height:100%;box-sizing:border-box;resize:none;border:1px solid var(--line);
  border-radius:var(--radius-sm);padding:12px;background:var(--card-solid);color:var(--text);
  font-family:inherit;font-size:var(--fs-14);line-height:1.55}
.док-текст[readonly]{background:var(--bg-2);color:var(--muted)}
.док-картинка{max-width:100%;height:auto;display:block;margin:0 auto;
  border:1px solid var(--line);border-radius:var(--radius-sm)}
/* Широкая таблица прокручивается внутри себя: страница не должна ездить вбок. */
.док-таблица-обёртка{overflow:auto;border:1px solid var(--line);border-radius:var(--radius-sm)}
.док-таблица{border-collapse:collapse;font-size:var(--fs-13);font-variant-numeric:tabular-nums}
.док-таблица th,.док-таблица td{border-bottom:1px solid var(--line);border-right:1px solid var(--line);
  padding:6px 9px;text-align:left;white-space:nowrap;max-width:320px;overflow:hidden;text-overflow:ellipsis}
.док-таблица th{background:var(--bg-2);font-weight:700;position:sticky;top:0}
@media(max-width:560px){.док-оверлей{padding:0}.док-окно{height:100%;border-radius:0}}


/* Кегль компактной кнопки вырос на ступень (12 → 13), а отступы остались —
   высота уехала с 34 на 35,5 и выпала из шкалы 32/34/38. Высоту задаём явно,
   а не подбираем отступами: подобранная под кегль высота уедет снова при
   следующей правке шрифта. */
button.compact,.btn.compact{height:34px;min-height:34px;padding-top:0;padding-bottom:0;
  display:inline-flex;align-items:center;justify-content:center;gap:6px}


/* Шапка липкая (sticky, высота 52). Прокрутка к элементу — своя у браузера и
   у программы — ставила его ровно под ней, и нажатие уходило в шапку, а не в
   кнопку. Запас на высоту шапки нужен всему, к чему вообще прокручивают. */
#tab-agent .chat-feed>*,#tab-agent .assist-option,#tab-agent .agent-subcard,
#tab-agent .card{scroll-margin-top:60px}

/* ── Разговор: блоки лежат на полотне, а не висят над ним ──────────────────
   Владелец 31.08.2026: «тень блоков слишком выделяется, должна быть более
   рассеяна». Резким её делала не столько тень, сколько ближний слой
   0 1px 2px вместе с рамкой в 18% — вместе они читались как двойной контур. */
#chatFeed .card,
#tab-agent #chatFeed .agent-msg.assistant,
#chatFeed .assist-option,
#chatFeed .agent-subcard{
  box-shadow:var(--shadow-soft);
  /* Рамка полной силы, как у карточек остальных разделов: на 62 % край
     карточки отличался от полотна на 1.03:1 — она сливалась с фоном, и
     рассеянная тень этого не спасала (АУДИТ_ВИДА). */
  border-color:var(--line)}
/* Пузырь владельца залит цветом кнопки: рамка и тень ему не нужны вовсе,
   а общее правило подсвечивало его контуром. */
#tab-agent #chatFeed .agent-msg.user{box-shadow:none;border-color:transparent}
#chatFeed .card:hover{border-color:color-mix(in srgb,var(--line) 88%,transparent)}

/* ── Разговор в списке: открыть, скачать, удалить ──────────────────────────
   Кнопки лежат РЯДОМ со строкой, а не внутри неё: строка сама кнопка.
   Размер — 32, нижняя ступень шкалы высот, чтобы не спорить со строкой. */
.talk-line{display:flex;align-items:center;gap:6px}
.talk-line>.talk{flex:1 1 auto;min-width:0}
.talk-acts{display:flex;gap:4px;flex:0 0 auto}
.talk-act{width:32px;height:32px;min-height:32px;padding:0;display:flex;align-items:center;
  justify-content:center;border:1px solid var(--line);border-radius:var(--radius-xs);
  background:var(--control);color:var(--muted);cursor:pointer;box-shadow:none}
.talk-act:hover{background:var(--control-hover);color:var(--text)}
.talk-act svg{width:16px;height:16px}
.talk-act-опасно:hover{color:var(--bad);border-color:color-mix(in srgb,var(--bad) 40%,var(--line))}

/* ── Живой ход: что делаю прямо сейчас ─────────────────────────────────────
   Три точки бегут по очереди — этого хватает, чтобы отличить работу от
   зависания. Движение выключается вместе с системной настройкой «меньше
   движения»: мигающий блок в поле зрения мешает читать. */
.agent-live{display:flex;align-items:center;gap:8px;margin-top:8px;padding:8px 12px;
  border:1px solid var(--line);border-radius:var(--radius);background:var(--card);
  box-shadow:var(--shadow-soft)}
.live-dots{display:inline-flex;gap:4px;flex:0 0 auto}
.live-dots i{width:6px;height:6px;border-radius:var(--radius-circle);background:var(--accent);
  opacity:.35;animation:живыеТочки 1.1s infinite ease-in-out}
.live-dots i:nth-child(2){animation-delay:.16s}
.live-dots i:nth-child(3){animation-delay:.32s}
@keyframes живыеТочки{0%,80%,100%{opacity:.3;transform:translateY(0)}
  40%{opacity:1;transform:translateY(-3px)}}
.live-body{display:flex;flex-direction:column;gap:4px;min-width:0;flex:1 1 auto}
.live-text{font-size:var(--fs-13);color:var(--text);white-space:nowrap;overflow:hidden;
  text-overflow:ellipsis}
.live-prev{font-size:var(--fs-12);color:var(--muted);white-space:nowrap;overflow:hidden;
  text-overflow:ellipsis}
.live-prev:empty{display:none}
.live-time{font-size:var(--fs-12);color:var(--muted);flex:0 0 auto;
  font-variant-numeric:tabular-nums}
@media(prefers-reduced-motion:reduce){.live-dots i{animation:none;opacity:.6}}

/* ── Строка под чатом: одна высота на все кнопки ───────────────────────────
   Замер 31.08.2026: скрепка, микрофон, модель и страница стояли на 34, а
   счётчик шагов и кнопка отправки — на 38, причём счётчик ещё и кеглем 12.
   Владелец: «блоки отличаются шрифтами, высотой и размерами». Высоту берём
   у большинства (34), кегль — общий для строки. Кнопка отправки остаётся
   кругом: она отличается ролью, а не размером. */
/* Высота ряда — 34, как в эталоне (`Макет/стиль.py`: .icb 34×34, .ctx 34).
   Правило выше задавало ряду 38 и не трогало ширину значка: скрепка и
   микрофон выходили 34×38, то есть прямоугольниками. Владелец 13.09.2026:
   «значки не квадратные, а прямоугольные — значит, неправильно настроена
   высота всех кнопок, нужно сделать чуть меньше, чтобы всё было идеально и
   симметрично». Отправка тоже 34: круг отличает её по РОЛИ, а не по размеру,
   и ровно на разнобой 34/38 в этом ряду владелец жаловался ещё 31.08.2026
   («блоки отличаются высотой»). Эталон `Макет/стиль.py` поправлен тем же
   ходом, иначе код и макет разойдутся. */
#tab-agent .composer-row .icb,
#tab-agent .composer-row #agentQueue,
#tab-agent .composer-row .ctx,
#tab-agent .composer-row .composer-spend{height:34px;min-height:34px}
#tab-agent .composer-row .icb,
#tab-agent .composer-row .composer-spend{width:34px}
#tab-agent .composer-row .send{width:34px;height:34px;min-height:34px}
/* Правая половина ряда — кто отвечает, голос и отправка — стоит группой и не
   сжимается: владелец 10.09.2026 просил эти три рядом, а не по краям строки.
   Имя модели ужимается многоточием, чтобы длинное название не выталкивало
   кнопку отправки за край (`min-width:0` — иначе flex не даёт ужаться). */
/* `0 1 auto` + min-width:0 — группа не растёт, но в узкой панели уступает
   место: сжимается имя модели (у него многоточие), а не выдавливается
   кнопка отправки за край. Владелец 10.09.2026 просил эти три рядом. */
#tab-agent .composer-право{flex:0 1 auto;min-width:0;align-items:center}
/* Дно у фишки модели обязательно. Без него на панели 320px она сжималась до
   21px — меньше цели нажатия 24×24 по WCAG 2.2, и от кнопки оставалась
   полоска без иконки (замер ТЕСТ_ДОСТУПНОСТЬ 10.09.2026). 34px — та же
   ширина, что у скрепки и микрофона, то есть «иконка без имени». */
#tab-agent .composer-право #composerModel{max-width:190px;min-width:34px}

/* Имя программы в живой строке: «Вкладка думает над ответом». Владелец
   31.08.2026: «прикольно будет в стиле бренда». Имя — акцентом, действие —
   обычным текстом: иначе строка читается как заголовок, а не как отчёт. */
.live-brand{color:var(--accent);font-weight:700}
.live-text{display:block}

/* ── Ровные ряды: свод 31.08.2026 ──────────────────────────────────────────
   Замер по обеим целям и всем пяти разделам нашёл три места, где рядом стоят
   элементы разной высоты. Шкала их не ловит — обе высоты законны, а глазом
   разнобой виден сразу. Владелец: «много нахожу». */
/* Приветствие: кнопка «читать вслух» 32 и значок состояния 28. */
#tab-agent .greeting-card .pill.subtle{height:32px;display:inline-flex;align-items:center}
/* «Данные»: «Перечитать страницу» 34 против «Сначала план» 38. */
#tab-data .row > #scanData,#tab-data .row > #preparePlan{height:38px;min-height:38px}
/* Выпадающий список режима был на 46 — единственная высота вне шкалы во всей
   программе. Поля и кнопки одного ряда стоят на 38. */
#interactionTargetMode,#interactionMode{height:38px;min-height:38px;padding-top:0;padding-bottom:0}

/* Тесная панель: подписи уступают место значкам (владелец, 01.09.2026 —
   «кнопки со словами слипаются, почему не оставить только значок»).
   Прячем ТЕКСТ, а не кнопку: действие остаётся доступным, у каждой кнопки
   есть title и aria-label, поэтому смысл не теряется ни для мыши, ни для
   чтения с экрана. Порог 400 px — ширина, на которой замер видит наложение. */
@media (max-width: 400px) {
  /* Имя модели раньше пряталось и здесь: в ряду с ним стояли ещё пять кнопок.
     С 10.09.2026 слева осталась одна скрепка, и «Мини» или «Sonnet» помещается
     даже на 380 — а владелец просил видеть справа именно КТО отвечает. */
  #tab-agent .composer-row .ctx { padding-left: 8px; padding-right: 8px; }
  /* Счётчик шагов занимал четверть строки: на узкой панели оставляем число. */
  #tab-agent .composer-row .composer-spend { padding-left: 8px; padding-right: 8px; }
  #tab-agent .composer-row .composer-spend .единица { display: none; }
}

/* «Страница» и «как работать» 15.09.2026 вернулись в ряд действий по просьбе
   владельца («должны быть ниже со всеми»). Подписи у них при этом НЕ прячутся:
   днём я закрыл их медиазапросом до 560 px, потому что замер на 460 давал три
   ряда вместо одного, — но причиной был не текст, а собственный бокс обёртки
   (лечится `display:contents` выше). Замер в настоящем расширении после этой
   починки: на 400 px все шесть кнопок стоят в ОДНУ строку и сумма их ширин 335
   при 354 доступных — подписи ужимаются многоточием сами. Прятать их раньше
   360 px значит показывать человеку ряд значков-загадок на обычной панели
   Chrome (её ширина по умолчанию как раз 400), что и ловит ТЕСТ_ШИРИНЫ_ПАНЕЛИ.
   Ниже 360 подписи убирает режим «панель-узко», и там смысл остаётся в
   `title` и `aria-label`. */
@media (max-width: 400px) {
  #tab-agent .composer-row .composer-задача .ctx { padding-left: 7px; padding-right: 5px; }
}

/* Ответ агента: разметка и кнопка копирования. Кнопка бледная и мелкая —
   она рядом с каждым ответом, и на ярком виде читалась бы как действие. */
.agent-msg .msg-list { margin: 0; padding-left: 18px; display: flex; flex-direction: column; gap: 4px; }
.agent-msg code { font-size: var(--fs-13); background: var(--control); border-radius: var(--radius-xs); padding: 1px 4px; }
/* Действия над ответом — один значок в правом нижнем углу карточки. Две
   кнопки подряд («Копировать» 28 и «Сохранить Excel» 34) владелец 04.09.2026
   назвал разнокалиберными и занимающими место. Сторону раскрытия выбирает
   panel.js по месту в ленте: у последнего ответа снизу пусто, и список
   уходит вверх, а у ответа наверху ленты — вниз. */
/* Знак действий не добавляет карточке строки: он лежит поверх её правого
   верхнего угла, на одной линии с первой строкой ответа. До 12.09.2026 это
   был отдельный ряд под текстом (`margin-top: 6px`), и каждая карточка
   вырастала на 34 px из-за кнопки, которой пользуются редко. */
.agent-msg .msg-actions { position: absolute; top: 5px; right: 5px; display: flex;
  justify-content: flex-end; user-select: none; }
/* Знак действий под ответом — тот же вид, что у «⋮» разговора в боковом
   списке (.боковое-чат-ещё): три круглые точки SVG, акцентный цвет, мягкая
   подсветка при наведении, без рамки. Раньше был глиф «⋮» тремя кривыми
   квадратами в приглушённом сером и рамкой при наведении — владелец
   07.09.2026: «3 точки кривые… не в нашем стиле, как в боковом меню». */
.agent-msg .msg-actions-btn {
  width: 26px; height: 26px; min-height: 26px; padding: 0;
  display: grid; place-items: center; line-height: 1;
  color: var(--accent); background: transparent; border: 0;
  border-radius: var(--radius-xs); cursor: pointer;
}
.agent-msg .msg-actions-btn svg { width: 16px; height: 16px; fill: currentColor; }
.agent-msg .msg-actions-btn:hover,
.agent-msg .msg-actions-btn[aria-expanded="true"] {
  background: var(--accent-soft); color: var(--accent);
}
.agent-msg .msg-menu {
  position: absolute; right: 0; top: calc(100% + 4px); z-index: 5;
  min-width: 200px; display: flex; flex-direction: column; gap: 4px; padding: 4px;
  background: var(--card); border: 1px solid var(--line);
  border-radius: var(--radius-xs); box-shadow: 0 10px 24px rgba(15, 23, 42, .12);
}
.agent-msg .msg-menu.вверх { top: auto; bottom: calc(100% + 4px); }
.agent-msg .msg-menu.hidden { display: none; }
.agent-msg .msg-menu-item {
  height: var(--h-btn-sm); min-height: var(--h-btn-sm); padding: 0 10px;
  display: flex; align-items: center; justify-content: flex-start;
  border: 0; background: transparent; color: var(--text);
  font-size: var(--fs-13); text-align: left; cursor: pointer;
  border-radius: var(--radius-xs);
}
.agent-msg .msg-menu-item:hover { background: var(--control-hover); }

/* Заголовки Markdown в ответе: раньше «##»/«###» показывались решётками
   (владелец 07.09.2026). Кегли из шкалы, скромно — это чат, а не документ. */
.agent-msg .msg-h { font-weight: 700; color: var(--text); line-height: 1.3; margin: 0; }
.agent-msg .msg-h1 { font-size: var(--fs-15); }
.agent-msg .msg-h2 { font-size: var(--fs-14); }
.agent-msg .msg-h3 { font-size: var(--fs-13); font-weight: 640; color: var(--muted); letter-spacing: .01em; }

/* Таблица Markdown в ответе: раньше строки «| … |» показывались сырыми
   (владелец 07.09.2026 — «блоки части таблиц кривые»). Своя прокрутка, чтобы
   широкая таблица не растягивала пузырь ответа. */
.agent-msg .msg-table-wrap { overflow-x: auto; margin: 0; }
.agent-msg .msg-table { border-collapse: collapse; width: 100%; font-size: var(--fs-13); font-variant-numeric: tabular-nums; }
.agent-msg .msg-table th, .agent-msg .msg-table td { border: 1px solid var(--line); padding: 4px 8px; text-align: left; vertical-align: top; }
.agent-msg .msg-table th { background: var(--bg-2); font-weight: 640; white-space: nowrap; }

/* Предупреждение о пределе хранения под списком разговоров. Кегль и цвет
   берёт у `small muted`, своё — только отбивка: примечание не должно
   слипаться с последней строкой списка. */
.chat-limit { margin-top: 8px; }

/* Отбор моделей — тот же чип, что папки разговоров: одна программа, один
   язык кнопок. Владелец 04.09.2026 просил фильтры «бесплатные, мощность,
   топ», потому что у ключа OpenRouter моделей сотни. */
.model-filters{display:flex;flex-wrap:wrap;gap:6px}
.model-filters .фильтр{height:var(--h-btn-sm);min-height:var(--h-btn-sm);padding:0 10px;
  border:1px solid var(--line);border-radius:var(--radius-xs);background:var(--control);
  color:var(--muted);font-size:var(--fs-12);font-weight:500;cursor:pointer}
.model-filters .фильтр:hover{background:var(--control-hover);color:var(--text)}
.model-filters .фильтр.current{background:var(--accent-soft);border-color:var(--accent-3);
  color:var(--tab-active);font-weight:600}

/* Приготовленный файл — карточка, а не кнопка с надписью «Сохранить имя.md»
   (владелец 09.09.2026: «хочется как интуитивно сделано у остальных»).
   Устройство то же, что в почте и мессенджерах: значок формата, имя, объём,
   стрелка сохранения; нажимается вся карточка.

   Роль элемента — карточка, поэтому угол 14 (--radius), а у значка внутри —
   8 (--radius-xs) как у любого текстового значка. Высоту задаёт содержимое,
   две строки: к шкале высот кнопок 32/34/38 карточка отношения не имеет,
   и в АУДИТ_ВИДА.py она названа строкой списка. */
.file-card{display:flex;align-items:center;gap:8px;width:100%;text-align:left;
  padding:8px;background:var(--card);border:1px solid var(--line);
  border-radius:var(--radius);color:var(--text);font-weight:400}
.file-card:hover{border-color:var(--line-strong)}
.file-card-знак{flex:0 0 auto;width:32px;height:32px;display:flex;
  align-items:center;justify-content:center;border-radius:var(--radius-xs);
  background:var(--mark-1);color:var(--ink-on-accent);
  font-size:12px;font-weight:700;letter-spacing:.02em}
/* Цвет значка — по формату, чтобы Excel и Markdown различались с одного
   взгляда. Оттенки берутся из палитры меток, а не подбираются на глаз. */
.file-card-знак.знак-xlsx{background:var(--mark-2)}
.file-card-знак.знак-csv{background:var(--mark-6)}
.file-card-знак.знак-json{background:var(--mark-5)}
.file-card-знак.знак-txt{background:var(--mark-3)}
/* gap 4, а не 2: шкала отступов проекта — 4/6/8/12/16/20, и своё число
   здесь ломало сторож дизайн-системы (замер 09.09.2026: 2px×1). */
.file-card-текст{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:4px}
.file-card-имя{font-size:13px;font-weight:600;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
.file-card-низ{font-size:12px;color:var(--muted)}
.file-card-стрелка{flex:0 0 auto;display:flex;color:var(--muted)}
.file-card-стрелка svg{width:18px;height:18px}
.file-card-готов .file-card-стрелка{color:var(--good)}

/* Вид результата в листе плана — это выбор, и он обязан быть виден.
   Класс `chip-accent` описан в этом файле ТОЛЬКО внутри `.greeting-chips`,
   поэтому здесь он не красил ничего: владелец нажимал кнопки и видел ровно
   тот же ряд (04.09.2026). Своё правило и своя ступень высоты — 24-пиксельные
   чипы для выбора мелковаты и по WCAG 2.2. */
#planApproveFormat .chip{height:var(--h-btn-sm);min-height:var(--h-btn-sm);
  display:inline-flex;align-items:center;padding:0 12px;font-size:13px;cursor:pointer}
#planApproveFormat .формат-выбран{background:var(--accent-soft);
  border:1.5px solid var(--accent);color:var(--accent-2);font-weight:600}

/* ── Гейт доступа: полноэкранный вход (жёсткий гейт по аккаунту) ──────────────
   Перекрывает всю программу до подтверждения сессии. position:fixed inset:0 —
   поэтому неважно, где во вёрстке лежит блок и какая раскладка у body. */
.гейт{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;
  padding:20px;background:var(--bg);overflow:auto}
.гейт.hidden{display:none}
.гейт-карта{max-width:380px;width:100%;margin:0}
.гейт-шапка{display:flex;align-items:center;gap:8px}
.гейт-шапка .brand-mark{width:28px;height:28px;display:inline-flex;color:var(--accent)}
.гейт-шапка .brand-mark svg{width:100%;height:100%}
.гейт-бренд{font-weight:780;font-size:20px;letter-spacing:-.01em}
.гейт-титул{font-size:15px}
.гейт-состояние.hidden{display:none}
.гейт-вкладки{display:flex;gap:6px}
.гейт-таб{flex:1;background:var(--card);border:1px solid var(--line);
  border-radius:var(--radius-xs);padding:7px 9px;font-weight:650;color:var(--muted)}
.гейт-таб.current{background:var(--accent-soft);border-color:var(--accent);color:var(--accent-2)}
.гейт input{width:100%}
.гейт-ошибка{color:var(--bad)}
.гейт-ошибка.hidden{display:none}

/* ── Узкая боковая панель: подписи второстепенных фишек уходят в подсказку ──
   ТЗ владельца 12.09.2026, пп. 4 и 12: «второстепенные подписи сокращать или
   скрывать, имя модели и лимиты не обязательно текстом; в компактном режиме —
   значки, подробности по нажатию или наведению». Класс ставит panel.js по
   ИЗМЕРЕННОЙ ширине (`применитьШирину`), а не медиазапрос: состояние вида,
   которое меняется рукой человека, обязано быть читаемым из кода.

   Что НЕ сокращается ни на какой ширине: переписка, поле ввода и кнопка
   отправки. Приоритет из того же ТЗ: чат → поле ввода → основные действия. */
body.панель-узко #tab-agent .composer-задача .ctx .ellipsis,
body.панель-узко #tab-agent .composer-задача .ctx .ctx-chev,
body.панель-узко #tab-agent #composerModelName,
body.панель-узко #tab-agent #composerModel .ctx-chev{display:none}
/* Фишка без подписи — квадрат под значок, а не растянутая кнопка с пустотой. */
body.панель-узко #tab-agent .composer-задача .ctx,
body.панель-узко #tab-agent #composerModel{width:32px;min-width:32px;padding:0;
  justify-content:center;gap:0}
body.панель-узко #tab-agent #composerModel{width:38px;min-width:38px}
/* Средняя ширина: подписи остаются, но не тянут строку — чипы ужимаются. */
body.панель-средне #tab-agent .composer-задача .ctx .ellipsis,
body.панель-средне #tab-agent #composerModelName{max-width:92px}

/* ── Перенос строки списка мышью (ТЗ 13.09.2026, п. 2) ──────────────────── */
/* Классы общие для панели и окна: жест один (`чаты.js → включитьПеренос`),
   значит и подсказки одни. Что тащат — бледнеет, куда ляжет — линия по
   кромке соседа. Рамка вокруг всей строки читалась бы как «уронить ВНУТРЬ»,
   а внутрь разговора класть нечего. */
[draggable="true"].chat-item,
[draggable="true"].боковое-чат-ряд{cursor:grab}
.тащим{opacity:.45;cursor:grabbing}
.вставка-сверху{box-shadow:inset 0 2px 0 0 var(--accent)}
.вставка-снизу{box-shadow:inset 0 -2px 0 0 var(--accent)}
