:root{
  --paper:#FFFFFF;--rail:#F7F8F9;--ink:#17191C;--graphite:#454B55;--sec:#5A606B;--ter:#6E7480;
  --line:#E6E8EB;--line2:#DADDE1;--field:#EEF0F2;--bubble:#F1F3F5;--accent:#3B4FD8;
  --ok:#1C6B43;--okbg:#E6F2EA;--warn:#6F4B00;--warnbg:#FFF1D1;--err:#A1281F;--errbg:#FDECEA;
}
*{box-sizing:border-box}
html,body{height:100%;margin:0}
body{background:var(--paper);color:var(--ink);font:15px/1.55 'Onest',system-ui,-apple-system,'Segoe UI',sans-serif}
button,input,textarea,select{font:inherit;color:inherit}
button{cursor:pointer}
a{color:var(--accent)}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
code,pre{font-family:'JetBrains Mono',ui-monospace,Menlo,monospace}
.app{display:flex;height:100vh;height:100dvh}
.loading{padding:40px;color:var(--sec)}

/* боковая панель */
.side{width:268px;flex:0 0 268px;background:var(--rail);border-right:1px solid var(--line);padding:18px 12px;display:flex;flex-direction:column;gap:16px;overflow-y:auto}
/* проекты в меню: плитки по два в ряд */
.pgrid{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:-8px}
.pt{display:flex;align-items:center;gap:8px;min-width:0;min-height:52px;padding:7px 8px;border:1px solid var(--line);border-radius:12px;background:var(--paper);text-align:left;font-size:13px;line-height:1.25;transition:box-shadow .12s,border-color .12s}
.pt:hover{border-color:var(--line2);box-shadow:0 1px 4px rgba(0,0,0,.06)}
.pt.on{border-color:var(--ink);box-shadow:0 0 0 1px var(--ink)}
.pt .pi{flex:0 0 30px;width:30px;height:30px;border-radius:9px;background:var(--pc,#E8ECEF);display:flex;align-items:center;justify-content:center;font-size:12.5px;font-weight:600}
.pt .pn{min-width:0;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;word-break:break-word}
.pt.on .pn{font-weight:600}
.pmore-row{display:flex;align-items:center;gap:6px}
.pmore{flex:1;min-height:34px;padding:0 10px;border:0;border-radius:10px;background:transparent;color:var(--sec);font-size:13px;text-align:left;display:flex;align-items:center;justify-content:space-between}
.pmore:hover,.pmore[aria-expanded="true"]{background:var(--field);color:var(--ink)}
.pfly{position:fixed;z-index:60;width:200px;max-height:70vh;overflow-y:auto;padding:8px;display:flex;flex-direction:column;gap:6px;background:var(--rail);border:1px solid var(--line);border-radius:14px;box-shadow:0 8px 28px rgba(0,0,0,.14);animation:pfly .14s ease-out}
@keyframes pfly{from{opacity:0;transform:translateX(-8px)}to{opacity:1;transform:none}}
.brand{display:flex;align-items:center;gap:10px;padding:2px 8px}
.brand b{font-size:19px;font-weight:600;letter-spacing:-.01em}
.proj{display:flex;gap:6px}
.proj select{flex:1;min-width:0;min-height:44px;padding:0 10px;border:1px solid var(--line);border-radius:10px;background:var(--paper);font-weight:600}
.navi{display:flex;align-items:center;gap:10px;width:100%;min-height:38px;padding:0 10px;border:0;border-radius:9px;background:transparent;text-align:left;font-size:14px;color:var(--ink);text-decoration:none}
.navi:hover{background:#EDEFF2}
.navi.on{background:#E6E9ED;font-weight:600}
.navi .t{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.navi small{color:var(--ter);font-size:12px}
.group-h{display:flex;align-items:center;justify-content:space-between;padding:0 4px 0 10px;font-size:12.5px;color:var(--ter)}
.dot{width:8px;height:8px;border-radius:999px;flex:0 0 auto;background:#B8BDC4}
.dot.pin{background:transparent;border:1.5px solid var(--graphite)}
.side-bottom{margin-top:auto;display:flex;flex-direction:column;gap:2px}
.ver{padding:6px 10px 0;font-size:12px;color:var(--ter)}

/* кнопки */
.btn{display:inline-flex;align-items:center;gap:6px;min-height:38px;padding:0 14px;border:1px solid var(--line2);border-radius:10px;background:var(--paper);font-size:14px}
.btn:hover{background:#F6F7F8}
.btn.primary{background:var(--ink);border-color:var(--ink);color:#fff;font-weight:500}
.btn.primary:hover{background:#2B2E33}
.btn.ghost{border-color:var(--line)}
.btn.on{background:var(--field)}
.btn.sm{min-height:32px;padding:0 10px;font-size:13px}
.btn.danger{color:var(--err)}
.ib{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border:0;border-radius:8px;background:transparent;color:var(--ter)}
.ib:hover{background:var(--field)}
.ib.on{color:var(--ink);background:var(--field)}
.linkbtn{border:0;background:transparent;padding:4px 6px;font-size:13px;font-weight:500;text-decoration:underline;text-underline-offset:3px}

/* основная область */
.main{flex:1;min-width:0;display:flex;flex-direction:column}
.top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;padding:12px 24px;border-bottom:1px solid var(--line)}
.crumbs{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--sec);min-width:0}
.crumbs b{color:var(--ink);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tools{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13px;color:var(--sec)}
.meter{display:inline-block;width:48px;height:4px;border-radius:999px;background:var(--line);vertical-align:middle;margin-left:6px}
.meter i{display:block;height:4px;border-radius:999px;background:var(--graphite)}
.lim{display:flex;flex-direction:column;gap:5px}
.lim-top{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px;font-size:14px}
.lim-bar{height:8px;border-radius:999px;background:var(--line);overflow:hidden}
.lim-bar i{display:block;height:100%;border-radius:999px;background:var(--graphite)}
.lim-bar.hot i{background:var(--err)}
.mono-pre{white-space:pre-wrap;word-break:break-all;font-size:12px;max-height:200px;overflow:auto}

.chatwrap{flex:1;min-height:0;display:flex}
.stream{flex:1;min-width:0;display:flex;flex-direction:column}
.scroll{flex:1;overflow-y:auto;padding:28px 48px 8px 24px}
.col{max-width:760px;margin:0 auto;display:flex;flex-direction:column;gap:20px}
.msg.user{position:relative;align-self:flex-end;max-width:80%;background:var(--bubble);padding:12px 16px;border-radius:14px 14px 4px 14px;white-space:pre-wrap;word-wrap:break-word}
.msg.user .ux{position:absolute;left:-34px;top:6px;width:26px;height:26px;border:0;border-radius:999px;background:transparent;color:var(--ter);font-size:18px;line-height:1;opacity:0;transition:opacity .15s}
.msg.user:hover .ux,.msg.user .ux:focus-visible{opacity:1}
.msg.user .ux:hover{background:var(--field);color:var(--ink)}
@media (hover:none){.msg.user .ux{opacity:.6}}
.msg.bot{display:flex;flex-direction:column;gap:8px}
.who{display:flex;align-items:center;gap:8px;font-size:13px}
.who small{color:var(--ter)}
.mono{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:6px;background:#EEF0F3;font-size:10.5px;font-weight:600;flex:0 0 auto}
.acts{display:flex;gap:2px}
.ib.wide{width:auto;padding:0 8px;gap:5px;font-size:13px}
/* главы и полоска навигации по чату */
.more{align-self:center;min-height:32px;padding:0 14px;border:1px solid var(--line2);border-radius:999px;background:var(--paper);color:var(--sec);font-size:13px}
.flash{outline:2px solid var(--accent,#3B4FD8);outline-offset:4px;transition:outline-color 1s}
.rail{position:absolute;right:16px;top:16px;bottom:160px;z-index:4;width:22px;overflow-y:auto;overflow-x:hidden;scrollbar-width:none;display:flex;flex-direction:column;gap:5px;padding:6px 0;border-radius:12px;transition:width .15s,background .15s}
.rail::-webkit-scrollbar{display:none}
.rail[hidden]{display:none}
.rail-i{flex:0 0 auto;display:flex;align-items:center;gap:8px;height:6px;padding:0 5px;border:0;border-radius:6px;background:transparent;text-align:left;color:var(--sec);font-size:12.5px;white-space:nowrap;cursor:pointer}
.rail-i .tk{flex:0 0 auto;width:10px;height:2px;border-radius:2px;background:var(--line2)}
.rail-i.ch .tk{width:12px;height:3px;background:var(--ter)}
.rail-i.on .tk{background:var(--accent,#3B4FD8)}
.rail-i .t{display:none;overflow:hidden;text-overflow:ellipsis}
.rail:hover,.rail:focus-within{width:280px;background:var(--paper);box-shadow:0 4px 18px rgba(0,0,0,.12);gap:0;padding:6px;scrollbar-width:thin}
.rail:hover::-webkit-scrollbar,.rail:focus-within::-webkit-scrollbar{display:block;width:6px}
.rail:hover .rail-i,.rail:focus-within .rail-i{height:auto;min-height:28px}
.rail:hover .rail-i .t,.rail:focus-within .rail-i .t{display:block}
.rail-i:hover{background:var(--field);color:var(--ink)}
.rail-i.ch .t{font-weight:600;color:var(--ink)}
.rail-i.on .t{color:var(--ink)}
.note{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--sec)}
.note svg{flex:0 0 auto}
.note.cp{margin:6px 0}
.note.cp span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.err{padding:12px 14px;border-radius:10px;background:var(--errbg);color:var(--err);font-size:14px}
.typing{color:var(--ter)}
.steps{display:flex;flex-direction:column;gap:2px;font-size:12.5px;color:var(--ter)}
.steps:empty{display:none}
.steps div{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.btn:disabled{opacity:.45;cursor:default}
.empty{padding:22px;border:1px solid var(--line);border-radius:14px;display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.empty h2{margin:0;font-size:18px;font-weight:600}
.empty p{margin:0;color:var(--graphite)}

/* markdown */
.md{word-wrap:break-word}
.md p{margin:0 0 10px}.md p:last-child{margin-bottom:0}
.md h2,.md h3,.md h4,.md h5{margin:16px 0 8px;line-height:1.3}
.md h2{font-size:20px}.md h3{font-size:17px}.md h4,.md h5{font-size:15px}
.md ul,.md ol{margin:0 0 10px;padding-left:22px}
.md li{margin:2px 0}
.md code{background:#F1F3F5;padding:1px 5px;border-radius:5px;font-size:13px}
.md pre{background:var(--rail);border:1px solid var(--line);border-radius:10px;padding:12px 14px;overflow-x:auto;margin:0 0 10px}
.md pre code{background:none;padding:0;font-size:13px;line-height:1.6}
.stream{position:relative}
.tobottom{position:absolute;left:calc(100% + 12px);bottom:4px;z-index:5;width:38px;height:38px;padding:0;border:1px solid var(--line2);border-radius:50%;background:var(--paper);box-shadow:0 2px 8px rgba(0,0,0,.08);font-size:18px;line-height:1}
@container cw (max-width:860px){.tobottom{left:auto;right:8px;bottom:calc(100% + 8px)}}
.tobottom[hidden]{display:none}
.code{position:relative;margin:0 0 10px}
.code pre{margin:0;padding-top:36px}
.copy-code{position:absolute;top:6px;right:6px;display:flex;align-items:center;gap:6px;min-height:30px;padding:0 10px;border:1px solid var(--line2);border-radius:8px;background:var(--paper);font-size:12.5px;color:var(--graphite)}
.copy-code:hover{background:var(--field)}
.tbl{overflow-x:auto;margin:0 0 12px;border:1px solid var(--line);border-radius:10px}
.tbl table{border-collapse:collapse;width:100%;font-size:14px}
.tbl th,.tbl td{padding:8px 12px;border-top:1px solid var(--line);text-align:left;vertical-align:top}
.tbl th{background:var(--rail);border-top:0;font-weight:500;color:var(--sec)}

/* поле ввода */
.composer-wrap{padding:8px 24px 20px;container:cw/inline-size}
.composer-col{position:relative}
.composer{border:1px solid var(--line2);border-radius:16px;background:var(--paper);box-shadow:0 1px 2px rgba(23,25,28,.04);padding:10px 10px 8px 16px;display:flex;flex-direction:column;gap:6px}
.composer textarea{border:0;resize:none;background:transparent;font-size:15px;line-height:1.5;padding:4px 0;max-height:240px}
.composer textarea:focus{outline:none}
.composer .row{display:flex;align-items:center;gap:6px}
.grow{flex:1}
/* файлы в чате */
.atts{display:flex;flex-wrap:wrap;gap:6px}
.atts[hidden]{display:none}
.att{display:flex;align-items:center;gap:8px;max-width:260px;min-height:40px;padding:4px 4px 4px 8px;border:1px solid var(--line);border-radius:10px;background:var(--rail);font-size:13px}
.att img{width:30px;height:30px;object-fit:cover;border-radius:6px}
.att .an{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.att small{color:var(--sec);white-space:nowrap}
.att.bad{border-color:#e3b4b4;background:#fdf3f3}
.ax{width:28px;height:28px;flex:none;border:0;border-radius:6px;background:transparent;color:var(--sec);font-size:18px;line-height:1}
.ax:hover{background:var(--field)}
.mfiles{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:6px}
.mfile{display:inline-flex;align-items:center;gap:6px;max-width:100%;padding:6px 10px;border:1px solid var(--line);border-radius:10px;background:var(--paper);color:inherit;text-decoration:none;font-size:13px}
.mfile span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mfile small{color:var(--sec)}
.mfile:hover{background:var(--field)}
.mimg img{display:block;max-width:220px;max-height:160px;border-radius:10px;border:1px solid var(--line)}
.stream.drop .composer{border-color:var(--accent,#3B4FD8);box-shadow:0 0 0 3px rgba(59,79,216,.15)}
.chip{display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:0 10px 0 6px;border:1px solid var(--line);border-radius:999px;background:var(--rail);font-size:13.5px}
.chip .mono{width:24px;height:24px;border-radius:999px;background:#fff;border:1px solid var(--line)}
.chip small{color:var(--sec)}
.send{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border:0;border-radius:999px;background:var(--ink)}
.send:disabled{opacity:.4;cursor:default}

/* выбор модели */
.pop{position:absolute;right:0;bottom:calc(100% + 8px);width:100%;max-width:460px;background:#fff;border:1px solid #E1E4E8;border-radius:14px;box-shadow:0 12px 32px rgba(23,25,28,.12);padding:8px;z-index:10;display:flex;flex-direction:column;max-height:calc(100dvh - 190px)}
.pop-list{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain}
.pop-auto,.pop-effort,.pop-foot{flex:none}
.pop-auto{display:flex;align-items:center;gap:12px;padding:8px 10px 12px;border-bottom:1px solid #EEF0F2}
.pop-auto div{flex:1}.pop-auto small{display:block;color:var(--sec);font-size:13px}
.switch{width:44px;height:26px;padding:3px;border:0;border-radius:999px;background:#C9CDD3;display:flex;align-items:center;flex:0 0 auto}
.switch span{width:20px;height:20px;border-radius:999px;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.2);transition:transform .15s}
.switch.on{background:var(--accent)}.switch.on span{transform:translateX(18px)}
.pop-row{display:flex;align-items:center;gap:12px;width:100%;min-height:52px;padding:8px 10px;border:0;border-radius:10px;background:transparent;text-align:left}
.pop-row:hover{background:#F6F7F8}.pop-row.sel{background:#F1F3F5}
.pop-row .mono{width:28px;height:28px;border-radius:7px;font-size:12px}
.pop-mid{flex:1;min-width:0;display:flex;flex-direction:column}
.pop-mid small{color:var(--sec);font-size:12.5px}
.pop-effort{padding:10px;border-top:1px solid #EEF0F2;margin-top:6px}
.pop-effort small{display:block;color:var(--sec);font-size:12.5px;margin-bottom:8px}
.seg{display:flex;gap:2px;padding:2px;background:#F1F3F5;border-radius:10px}
.seg button{flex:1;min-height:32px;border:0;border-radius:8px;background:transparent;font-size:13px;color:var(--sec)}
.seg button.on{background:#fff;color:var(--ink);box-shadow:0 1px 2px rgba(0,0,0,.12)}
.pop-foot{padding:10px;border-top:1px solid #EEF0F2;margin-top:6px;font-size:12.5px;color:var(--sec)}
.tag{font-size:11.5px;font-weight:500;padding:1px 8px;border-radius:999px;margin-left:6px;white-space:nowrap}
.tag.strong{background:var(--okbg);color:var(--ok)}.tag.medium{background:#EEF0F3;color:var(--graphite)}

/* панель «Что знает модель» */
.ctx{width:340px;flex:0 0 340px;border-left:1px solid var(--line);background:#FBFBFC;padding:20px;overflow-y:auto;display:flex;flex-direction:column;gap:16px}
.ctx h3{margin:0;font-size:16px;font-weight:600}
.ctx .sub{font-size:13px;color:var(--sec)}
.ctx-g{display:flex;flex-direction:column;gap:2px}
.ctx-g .h{font-size:12.5px;color:var(--ter);padding-bottom:4px}
.ctx-i{display:flex;align-items:baseline;gap:10px;padding:5px 8px;margin:0 -8px;border:0;border-radius:8px;background:transparent;text-align:left;width:calc(100% + 16px);font-size:13.5px}
.ctx-i:hover{background:var(--field)}
.ctx-i span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ctx-i small{color:var(--sec);font-variant-numeric:tabular-nums}

/* страницы: модели, память */
.page{flex:1;overflow-y:auto;padding:28px 24px 48px}
.page-col{max-width:920px;margin:0 auto;display:flex;flex-direction:column;gap:24px}
.page h1{margin:0;font-size:26px;font-weight:600;letter-spacing:-.015em}
.page h2{margin:0 0 4px;font-size:17px;font-weight:600}
.lead{margin:4px 0 0;color:var(--graphite);max-width:680px}
.card{border:1px solid var(--line);border-radius:14px;padding:16px;display:flex;flex-direction:column;gap:12px}
.card .row{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.muted{color:var(--sec);font-size:13.5px}
.form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.form label{display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--sec)}
.form .full{grid-column:1/-1}
.form input,.form select,.inp{min-height:40px;padding:0 12px;border:1px solid var(--line2);border-radius:10px;background:#fff;font-size:14px;color:var(--ink)}
.mlist{display:flex;flex-direction:column;gap:6px;max-height:280px;overflow-y:auto}
.mrow{display:flex;align-items:center;gap:10px;padding:6px 8px;border-radius:8px;font-size:14px}
.mrow:hover{background:#F6F7F8}
.mrow code{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;font-size:13px}
.models-table{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:14px;overflow:hidden}
.mt-row{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:12px 14px;border-top:1px solid var(--line)}
.mt-row:first-child{border-top:0}
.grip{flex:none;width:22px;min-height:32px;display:inline-flex;align-items:center;justify-content:center;color:var(--sec);cursor:grab;touch-action:none;user-select:none;letter-spacing:-3px;font-size:14px}
.dragging{opacity:.75;background:#F1F3F5;box-shadow:0 4px 14px rgba(0,0,0,.10);position:relative;z-index:2}
.dragging .grip{cursor:grabbing}
.sortlist{display:flex;flex-direction:column;gap:10px}
.crumb-p{color:var(--sec);font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:40vw}
.pf-drop{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:12px;border:1px dashed var(--line2);border-radius:12px}
.pf-drop.on{border-color:var(--ink);background:#F1F3F5}
.pf-drop small{color:var(--sec);font-size:12.5px}
.pf-list{display:flex;flex-direction:column;gap:6px}
.pf-i{display:flex;align-items:center;gap:8px;min-height:40px;padding:4px 4px 4px 8px;border:1px solid var(--line);border-radius:10px;background:#fff;font-size:13.5px}
.pf-i img{width:30px;height:30px;object-fit:cover;border-radius:6px;flex:none}
.pf-i svg{flex:none}
.pf-i a{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ink);text-decoration:none}
.pf-i small{color:var(--sec);white-space:nowrap}
.pf-bar{height:6px;border-radius:3px;background:#EEF0F2;overflow:hidden}
.pf-bar span{display:block;height:100%;background:var(--ink)}
.pf .bad{white-space:pre-line}
.relbox{display:flex;flex-direction:column;gap:4px;padding:6px 4px 0}
.relbox small{color:var(--ter);font-size:12px;padding-left:4px}
.btn.full{width:100%;justify-content:center}
.safe-row code{font-size:13px;word-break:break-all}
.safe-row .small{font-size:12px;flex-basis:100%}
.mt-row .inp{flex:1 1 200px;min-width:0}
.mt-row select{min-height:36px;border:1px solid var(--line2);border-radius:9px;padding:0 8px;background:#fff}
.chk{display:inline-flex;align-items:center;gap:6px;font-size:13.5px}
.perm-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:12px}
.perm-t{border-collapse:collapse;width:100%;font-size:14px}
.perm-t th,.perm-t td{padding:10px 14px;border-top:1px solid var(--line);text-align:center;vertical-align:middle}
.perm-t thead th{border-top:0;background:var(--rail);font-size:13px;font-weight:600;color:var(--sec);white-space:nowrap}
.perm-t tbody th{text-align:left;font-weight:500;white-space:nowrap}
.perm-t td .switch{margin:0 auto}
.perm-t td small{display:block;color:var(--sec);font-size:12px;margin-top:4px}
.perm-t td .tag{display:inline-block;margin:4px 0 0}
.perm-t .switch:disabled{opacity:.5;cursor:default}
.tag.risk{background:var(--warnbg);color:var(--warn)}
.ok{color:var(--ok)}.bad{color:var(--err)}

.vault{display:flex;gap:20px;align-items:flex-start;flex-wrap:wrap}
.vtree{flex:1 1 240px;max-width:300px;display:flex;flex-direction:column;gap:2px;font-size:13.5px}
.vtree .h{padding:10px 8px 4px;font-size:12.5px;color:var(--ter)}
.vtree button{border:0;background:transparent;text-align:left;padding:6px 8px;border-radius:8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vtree button:hover{background:var(--field)}.vtree button.on{background:#E6E9ED;font-weight:600}
.vview{flex:999 1 420px;min-width:0;border:1px solid var(--line);border-radius:14px;padding:18px 20px;display:flex;flex-direction:column;gap:12px}
.vview textarea{width:100%;min-height:60vh;border:1px solid var(--line2);border-radius:10px;padding:12px;font:13px/1.6 'JetBrains Mono',ui-monospace,monospace}
.fm{font-size:12px;color:var(--ter);background:var(--rail);border-radius:8px;padding:8px 10px;white-space:pre-wrap}

@media (max-width:860px){
  .app{flex-direction:column;height:auto;min-height:100vh}
  .pfly{width:auto;right:12px;position:absolute}
  .side{width:auto;flex:0 0 auto;border-right:0;border-bottom:1px solid var(--line)}
  .side-bottom{margin-top:0}
  .chatwrap{flex-direction:column}
  .ctx{width:auto;flex:0 0 auto;border-left:0;border-top:1px solid var(--line)}
  .scroll{min-height:50vh}
  .rail{display:none}
  .form{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* предложения правок памяти */
.prop{border:1px solid var(--line2);border-radius:12px;padding:12px 14px;margin:10px 0;display:flex;flex-direction:column;gap:8px;background:var(--paper)}
.prop.pending{border-color:var(--accent)}
.prop.applied{border-color:var(--ok)}
.prop-h{display:flex;align-items:center;gap:8px;font-size:14px}
.prop-h .linkbtn{padding:0 2px;font-family:'JetBrains Mono',ui-monospace,Menlo,monospace;font-size:13px}
.prop-st{font-size:12.5px;color:var(--ter);white-space:nowrap}
.prop.pending .prop-st{color:var(--accent)}
.prop.applied .prop-st{color:var(--ok)}
.prop-note{font-size:14px;color:var(--graphite)}
.prop-warn{font-size:13px;padding:6px 10px;border-radius:8px;background:var(--warnbg);color:var(--warn)}
.prop-why{font-size:14px;display:flex;flex-direction:column;gap:3px;word-break:break-all}
.prop-why b{font-weight:600;margin-bottom:2px;word-break:normal}
.prop-cmd small{font-size:12px;color:var(--ter)}
.prop-cmd .diff{font-size:12px;opacity:.85;margin-top:3px}
.prop .linkbtn{align-self:flex-start;padding:0}
.prop-acts{display:flex;gap:8px;flex-wrap:wrap}
.diff{font:12.5px/1.5 'JetBrains Mono',ui-monospace,Menlo,monospace;background:var(--rail);border-radius:8px;padding:8px 0;max-height:360px;overflow:auto}
.diff div{padding:0 10px;white-space:pre-wrap;word-break:break-word}
.diff .add{background:var(--okbg);color:var(--ok)}
.diff .del{background:var(--errbg);color:var(--err)}
.diff .hunk{color:var(--ter)}
/* окна вместо системных alert/confirm/prompt */
.dlg-back{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(23,25,28,.28);animation:dlgIn .12s ease-out}
.dlg{width:100%;max-width:420px;background:var(--paper);border:1px solid #E1E4E8;border-radius:14px;box-shadow:0 12px 32px rgba(23,25,28,.16);padding:18px;display:flex;flex-direction:column;gap:14px}
.dlg-t{font-size:14.5px;line-height:1.5;color:var(--ink);white-space:normal;overflow-wrap:anywhere;max-height:50vh;overflow-y:auto}
.dlg-in{width:100%}
.dlg-b{display:flex;justify-content:flex-end;gap:8px}
@keyframes dlgIn{from{opacity:0}to{opacity:1}}
.login{display:flex;align-items:center;justify-content:center}
.login-card{width:100%;max-width:380px;gap:14px}
.login-card .brand{display:flex;align-items:center;gap:8px;font-size:18px}
.login-card .inp{width:100%}
.ver .linkbtn{font-size:12px;padding:0}
#ctxsum{cursor:help}