/* Free AI Hub v2 — стили. Без внешних шрифтов/CDN. Тёмная тема по умолчанию, светлая — [data-theme=light]. */
:root{
  --bg:#0a0d14;--bg2:#0f131c;--surface:#141926;--surface2:#1a2030;--surface3:#212839;--line:#252d40;--line2:#323c55;
  --text:#e8ebf4;--text2:#b6bdd0;--muted:#8891a8;
  --accent:#7c6cff;--accent2:#22d3ee;--accent-ink:#fff;--accent-soft:#7c6cff26;
  --ok:#34d399;--warn:#fbbf24;--err:#f87171;--info:#60a5fa;
  --user-bg:linear-gradient(135deg,#6a5cf5,#4f7df3);--user-ink:#fff;
  --code-bg:#0b0f18;--code-head:#121826;--shadow:0 12px 40px #00000066;--shadow-s:0 2px 10px #00000040;
  --glow:radial-gradient(900px 520px at 85% -12%,#241f55 0%,transparent 62%),radial-gradient(700px 480px at -5% 105%,#0c2b3a 0%,transparent 60%);
  --radius:14px;--radius-s:10px;--sbw:344px;
  --mono:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace;
  --sans:Inter,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans",Arial,sans-serif;
  --tk-c:#6b7794;--tk-s:#a5e3a0;--tk-k:#c4a7ff;--tk-n:#ffb86b;--tk-f:#7fd0ff;--tk-t:#ffd479;
  color-scheme:dark;
}
:root[data-theme=light]{
  --bg:#f4f5fa;--bg2:#ffffff;--surface:#ffffff;--surface2:#f1f3f9;--surface3:#e6e9f2;--line:#dde1ec;--line2:#c6ccdc;
  --text:#171b2b;--text2:#3d4560;--muted:#586178;
  --accent:#5b4bf0;--accent2:#0891b2;--accent-soft:#5b4bf01f;
  --ok:#047857;--warn:#a04a07;--err:#dc2626;--info:#2563eb;
  --user-bg:linear-gradient(135deg,#5b4bf0,#3f6cf0);
  --code-bg:#f6f7fb;--code-head:#eceef6;--shadow:0 12px 40px #1b23481f;--shadow-s:0 2px 10px #1b23481a;
  --glow:radial-gradient(900px 520px at 85% -12%,#e3defd 0%,transparent 62%),radial-gradient(700px 480px at -5% 105%,#d6f1f8 0%,transparent 60%);
  --tk-c:#7a8299;--tk-s:#0f7a3d;--tk-k:#7c3aed;--tk-n:#b45309;--tk-f:#0369a1;--tk-t:#a16207;
  color-scheme:light;
}
*{box-sizing:border-box}
html,body{height:100%;margin:0}
body{background:var(--glow),var(--bg);background-attachment:fixed;color:var(--text);font:15px/1.6 var(--sans);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow:hidden;-webkit-text-size-adjust:100%}
body.no-scroll{overflow:hidden}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
[hidden]{display:none!important}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.muted{color:var(--muted)}.small{font-size:12.5px}
.skip{position:fixed;left:12px;top:-60px;background:var(--accent);color:#fff;padding:8px 14px;border-radius:10px;z-index:100;transition:top .15s}
.skip:focus{top:12px}
:focus{outline:none}
:focus-visible{outline:2px solid var(--accent2);outline-offset:2px;border-radius:8px}
a{color:var(--accent2)}
kbd{font:600 11px var(--mono);background:var(--surface3);border:1px solid var(--line2);border-bottom-width:2px;border-radius:6px;padding:1px 6px;color:var(--text2)}

/* ----- каркас ----- */
.app{display:grid;grid-template-columns:var(--sbw) minmax(0,1fr);height:100dvh;transition:grid-template-columns .25s ease}
.app.collapsed{grid-template-columns:0 minmax(0,1fr)}
.app.collapsed .sidebar{visibility:hidden;transform:translateX(-12px);opacity:0}

/* ----- боковая панель ----- */
.sidebar{background:linear-gradient(180deg,var(--bg2),var(--bg));border-right:1px solid var(--line);display:flex;flex-direction:column;min-height:0;min-width:0;overflow:hidden;transition:transform .25s ease,opacity .2s,visibility .25s}
.sb-head{display:flex;align-items:center;justify-content:space-between;padding:16px 16px 6px}
.brand{display:flex;align-items:center;gap:12px;min-width:0}
.logo{flex:none;width:42px;height:42px;display:grid;place-items:center;border-radius:13px;color:#fff;background:linear-gradient(135deg,var(--accent),var(--accent2));box-shadow:0 6px 20px -6px var(--accent)}
.brand h1{font-size:17.5px;margin:0;letter-spacing:-.01em;line-height:1.2}
.brand p{margin:1px 0 0;color:var(--muted);font-size:12px;line-height:1.3}
.sidebar > .btn.wide{margin:10px 16px 4px;width:calc(100% - 32px)}
.tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;margin:10px 16px 0;padding:4px;background:var(--surface2);border:1px solid var(--line);border-radius:12px}
.tabs button{border:0;background:transparent;color:var(--muted);padding:7px 6px;border-radius:9px;font-weight:600;font-size:13.5px;transition:background .15s,color .15s}
.tabs button:hover{color:var(--text)}
.tabs button[aria-selected=true]{background:var(--surface);color:var(--text);box-shadow:var(--shadow-s)}
.sb-body{flex:1;min-height:0;overflow-y:auto;padding:14px 16px 20px;scrollbar-width:thin;scrollbar-color:var(--line2) transparent}
.pane{display:flex;flex-direction:column;gap:12px}
.group{display:flex;flex-direction:column;gap:8px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:12px}
.slot{display:flex;flex-direction:column;gap:8px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:12px}
.slot-title{display:flex;align-items:center;gap:8px}
.slot-tag{display:inline-grid;place-items:center;min-width:22px;height:22px;padding:0 6px;border-radius:7px;background:var(--accent);color:#fff;font-weight:700;font-size:12px}
.slot-tag.b{background:var(--accent2);color:#04121a}
.lbl{font-size:11.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.07em;font-weight:600}
.hint{margin:0;font-size:12.5px;color:var(--muted);line-height:1.5}
.hint b{color:var(--text2)}
.top-gap{margin-top:4px}.top-gap-s{margin-top:2px}
.row{display:flex;align-items:center}.row.between{justify-content:space-between}.row.gap{gap:8px}.row.wrap{flex-wrap:wrap}
.danger-text{color:var(--err)}

.field,select.field,input.field,textarea.field{width:100%;background:var(--surface2);color:var(--text);border:1px solid var(--line);border-radius:var(--radius-s);padding:9px 12px;outline:none;transition:border-color .15s,box-shadow .15s;min-width:0}
.field:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
textarea.field{resize:vertical;line-height:1.5}
select.field{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%238891a8' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:32px}
select.field option{background:var(--surface2);color:var(--text)}
input[type=range]{width:100%;accent-color:var(--accent);height:22px;margin:0}
output{font-variant-numeric:tabular-nums;color:var(--text2);font-size:13px}

/* ----- кнопки ----- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--surface2);color:var(--text);border:1px solid var(--line);border-radius:var(--radius-s);padding:8px 14px;font-weight:500;transition:background .15s,border-color .15s,transform .05s,box-shadow .15s;white-space:nowrap}
.btn:hover{border-color:var(--line2);background:var(--surface3)}
.btn:active{transform:translateY(1px)}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn.small{padding:5px 10px;font-size:13px;border-radius:9px}
.btn.wide{width:100%}
.btn.ghost{background:transparent}
.btn.primary{background:linear-gradient(135deg,var(--accent),#5b8cff);border-color:transparent;color:#fff;font-weight:600;box-shadow:0 6px 18px -8px var(--accent)}
.btn.primary:hover{filter:brightness(1.08)}
.btn.primary kbd{margin-left:auto;background:#ffffff26;border-color:#ffffff3d;color:#fff}
.btn.danger{background:var(--err);border-color:transparent;color:#fff}
.icon-btn{flex:none;display:inline-grid;place-items:center;width:38px;height:38px;border-radius:11px;background:transparent;border:1px solid transparent;color:var(--text2);transition:background .15s,border-color .15s,color .15s}
.icon-btn:hover{background:var(--surface2);border-color:var(--line);color:var(--text)}
.only-mobile{display:none}

/* ----- селекторы (провайдер/модель) ----- */
.picker{display:flex;align-items:center;gap:10px;width:100%;text-align:left;padding:9px 12px;background:var(--surface2);border:1px solid var(--line);border-radius:12px;transition:border-color .15s,background .15s}
.picker:hover{border-color:var(--line2);background:var(--surface3)}
.picker[aria-expanded=true]{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.pi-text{display:flex;flex-direction:column;min-width:0;flex:1;line-height:1.3}
.pi-text b{font-weight:600;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pi-text small{color:var(--muted);font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pi-text small.warn-note{color:var(--warn);white-space:normal}
.chev{flex:none;width:8px;height:8px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(45deg) translateY(-2px);margin-right:4px}
.plogo{flex:none;display:grid;place-items:center;width:30px;height:30px;border-radius:9px;color:#fff;font-weight:700;font-size:14px;background:linear-gradient(135deg,hsl(var(--h) 70% 55%),hsl(calc(var(--h) + 40) 70% 45%))}
.plogo.g-proxy{background:linear-gradient(135deg,#f59e0b,#ef4444)}
.plogo.g-local{background:linear-gradient(135deg,#10b981,#06b6d4)}
.dot{flex:none;width:9px;height:9px;border-radius:50%;background:var(--line2);box-shadow:0 0 0 3px transparent}
.dot.ok{background:var(--ok);box-shadow:0 0 0 3px #34d39926}
.dot.limited{background:var(--info);box-shadow:0 0 0 3px #60a5fa26}
.dot.flaky{background:var(--warn);box-shadow:0 0 0 3px #fbbf2426}
.dot.fail{background:var(--err);box-shadow:0 0 0 3px #f8717126}
.badges{display:flex;gap:6px;flex-wrap:wrap}
.badge{font-size:11.5px;padding:2px 9px;border-radius:99px;border:1px solid var(--line2);color:var(--muted);line-height:1.5}
.badge.ok{color:var(--ok);border-color:#34d39955;background:#34d3991a}
.badge.warn{color:var(--warn);border-color:#fbbf2455;background:#fbbf241a}
.badge.key{color:var(--accent);border-color:#7c6cff55;background:var(--accent-soft)}
.prov-info{display:flex;flex-direction:column;gap:8px}
.progress{height:4px;background:var(--surface3);border-radius:4px;overflow:hidden}
.progress .bar{height:100%;width:0;background:linear-gradient(90deg,var(--accent),var(--accent2));transition:width .3s}
#healthSumA.stale{color:var(--warn)}

.keybox{border:1px dashed var(--line2);border-radius:12px;padding:10px 12px}
.keybox summary{cursor:pointer;font-weight:600;font-size:13.5px;list-style:none;display:flex;gap:6px;align-items:baseline}
.keybox summary::-webkit-details-marker{display:none}
.keybox summary em{font-weight:400;color:var(--muted);font-style:normal;font-size:12.5px}
.keybox[open] summary{margin-bottom:10px}
.keybox[open]{display:flex;flex-direction:column;gap:8px}
.custom-only{display:none;flex-direction:column;gap:8px}
.custom-only.show{display:flex}

/* ----- переключатель ----- */
.switch{display:flex;align-items:center;gap:12px;cursor:pointer;padding:10px 12px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);font-weight:500;font-size:14px;line-height:1.35}
.switch small{color:var(--muted);font-weight:400}
.switch input{position:absolute;opacity:0;width:1px;height:1px}
.sw{flex:none;position:relative;width:38px;height:22px;border-radius:99px;background:var(--surface3);border:1px solid var(--line2);transition:background .2s,border-color .2s}
.sw::after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:var(--muted);transition:transform .2s,background .2s}
.switch input:checked + .sw{background:var(--accent);border-color:var(--accent)}
.switch input:checked + .sw::after{transform:translateX(16px);background:#fff}
.switch input:focus-visible + .sw{outline:2px solid var(--accent2);outline-offset:2px}

/* ----- список чатов ----- */
.chat-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}
.chat-item{position:relative;display:flex;align-items:stretch;border-radius:11px;border:1px solid transparent;transition:background .15s}
.chat-item:hover,.chat-item:focus-within{background:var(--surface2)}
.chat-item.cur{background:var(--accent-soft);border-color:#7c6cff44}
.chat-open{flex:1;min-width:0;text-align:left;background:none;border:0;padding:8px 10px;display:flex;flex-direction:column;line-height:1.35}
.ct-title{font-weight:600;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.chat-open small{color:var(--muted);font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.chat-tools{display:none;align-items:center;gap:2px;padding-right:6px}
.chat-item:hover .chat-tools,.chat-item:focus-within .chat-tools{display:flex}
.chat-tools button{width:26px;height:26px;border-radius:8px;border:0;background:transparent;font-size:13px;filter:grayscale(1);opacity:.75}
.chat-tools button:hover{background:var(--surface3);opacity:1}
@media (hover:none){.chat-tools{display:flex}}
dl.keys{display:grid;grid-template-columns:auto 1fr;gap:6px 12px;margin:0;font-size:13px;align-items:center}
dl.keys dt{white-space:nowrap}dl.keys dd{margin:0;color:var(--text2)}

/* ----- основная область ----- */
.main{display:flex;flex-direction:column;min-width:0;min-height:0;height:100dvh;position:relative}
.topbar{display:flex;align-items:center;gap:6px;padding:10px 16px;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--bg) 78%,transparent);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);z-index:5;padding-top:max(10px,env(safe-area-inset-top))}
.spacer{flex:1}
.cur{display:flex;align-items:center;gap:10px;min-width:0;max-width:min(720px,100%);background:transparent;border:1px solid transparent;border-radius:11px;padding:6px 10px;text-align:left;transition:background .15s,border-color .15s}
.cur:hover{background:var(--surface2);border-color:var(--line)}
.cur-text{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cur-text small{color:var(--muted);font-weight:400;font-size:13px}
.cur-text em{color:var(--muted);font-style:normal;margin:0 4px}
.menu-wrap{position:relative}
.menu{position:absolute;right:0;top:calc(100% + 6px);min-width:220px;background:var(--surface);border:1px solid var(--line2);border-radius:12px;box-shadow:var(--shadow);padding:6px;z-index:20;display:flex;flex-direction:column}
.menu button{background:none;border:0;text-align:left;padding:9px 12px;border-radius:8px;font-size:14px}
.menu button:hover,.menu button:focus-visible{background:var(--surface2)}
.banner{display:flex;align-items:center;gap:12px;margin:10px 16px 0;padding:10px 14px;border-radius:12px;font-size:13.5px;background:#fbbf2418;border:1px solid #fbbf2455;color:var(--warn)}
:root[data-theme=dark] .banner.warn{color:#fde68a}
.banner.err{background:#f8717118;border-color:#f8717155;color:var(--err)}
.banner.ok{background:#34d39918;border-color:#34d39955;color:var(--ok)}
.banner span{flex:1}
.banner-x{background:none;border:0;color:inherit;opacity:.7;font-size:14px;padding:2px 6px;border-radius:6px}
.banner-x:hover{opacity:1;background:#ffffff14}

.panels{flex:1;display:grid;grid-template-columns:minmax(0,1fr);min-height:0}
.panels.two{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.panels.two .panel + .panel{border-left:1px solid var(--line)}
.panel{display:flex;flex-direction:column;min-height:0;min-width:0;position:relative}
.panel-head{display:flex;align-items:center;gap:8px;padding:8px 18px;border-bottom:1px solid var(--line);font-size:13.5px;color:var(--text2);background:color-mix(in srgb,var(--surface) 60%,transparent)}
.plabel{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.plabel b{color:var(--text)}
.messages{flex:1;overflow-y:auto;overflow-x:hidden;padding:22px 18px 8px;display:flex;flex-direction:column;gap:18px;scroll-behavior:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--line2) transparent}
.messages > *{width:100%;max-width:820px;margin-left:auto;margin-right:auto}
.jump{position:absolute;right:22px;bottom:12px;width:36px;height:36px;border-radius:50%;background:var(--surface);border:1px solid var(--line2);box-shadow:var(--shadow);display:grid;place-items:center;color:var(--text);z-index:3}
.jump:hover{background:var(--surface2)}

/* ----- сообщения ----- */
.msg{display:flex;gap:12px;animation:rise .28s ease both}
@keyframes rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.avatar{flex:none;width:34px;height:34px;border-radius:11px;display:grid;place-items:center;background:var(--surface3);color:var(--text2);border:1px solid var(--line)}
.msg.assistant .avatar{color:#fff;border:0;background:linear-gradient(135deg,hsl(var(--h,260) 75% 60%),hsl(calc(var(--h,260) + 50) 75% 48%))}
.msg-main{min-width:0;flex:1;display:flex;flex-direction:column;gap:6px}
.who{display:flex;align-items:baseline;gap:8px;font-size:13px}
.who .name{font-weight:650;color:var(--text)}
.who .time{color:var(--muted);font-size:12px}
.msg.user{flex-direction:row-reverse}
.msg.user .msg-main{align-items:flex-end}
.msg.user .who{flex-direction:row-reverse}
.msg.user .avatar{background:var(--accent-soft);color:var(--accent);border-color:#7c6cff44}
.bubble{position:relative;max-width:100%;overflow-wrap:anywhere;word-break:break-word}
.msg.user .bubble{background:var(--user-bg);color:var(--user-ink);padding:10px 15px;border-radius:18px 18px 4px 18px;white-space:pre-wrap;box-shadow:0 6px 18px -10px var(--accent);max-width:min(100%,640px)}
.msg.assistant .bubble{background:var(--surface);border:1px solid var(--line);padding:12px 16px;border-radius:4px 18px 18px 18px;box-shadow:var(--shadow-s)}
.msg.assistant .bubble.empty{display:none}
.msg.assistant .bubble.err{background:#f8717114;border-color:#f8717155;color:var(--text);display:flex;gap:10px;align-items:flex-start}
.err-ico{color:var(--err);flex:none}
.bubble > :first-child{margin-top:0}.bubble > :last-child{margin-bottom:0}
.bubble p{margin:.6em 0}
.bubble h2,.bubble h3,.bubble h4,.bubble h5,.bubble h6{margin:1.1em 0 .4em;line-height:1.3;letter-spacing:-.01em}
.bubble h2{font-size:1.28em}.bubble h3{font-size:1.14em}.bubble h4,.bubble h5,.bubble h6{font-size:1.02em}
.bubble ul,.bubble ol{margin:.5em 0;padding-left:1.4em}
.bubble li{margin:.2em 0}.bubble li > ul,.bubble li > ol{margin:.2em 0}
.bubble li input[type=checkbox]{margin-right:6px;accent-color:var(--accent)}
.bubble blockquote{margin:.7em 0;padding:.2em 14px;border-left:3px solid var(--accent);color:var(--text2);background:var(--accent-soft);border-radius:0 10px 10px 0}
.bubble hr{border:0;border-top:1px solid var(--line2);margin:1em 0}
.bubble a{color:var(--accent2);text-underline-offset:2px}
.bubble code{font:.88em var(--mono);background:var(--surface3);border:1px solid var(--line);padding:1px 6px;border-radius:6px}
.bubble del{opacity:.7}
.table-wrap{overflow-x:auto;margin:.8em 0;border:1px solid var(--line);border-radius:12px}
.bubble table{border-collapse:collapse;width:100%;font-size:.94em}
.bubble th,.bubble td{padding:8px 12px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
.bubble th{background:var(--surface2);font-weight:650;white-space:nowrap}
.bubble tr:last-child td{border-bottom:0}
pre.codeblock{margin:.8em 0;background:var(--code-bg);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.code-head{display:flex;align-items:center;justify-content:space-between;padding:6px 8px 6px 14px;background:var(--code-head);border-bottom:1px solid var(--line)}
.code-head .lang{font:600 11.5px var(--mono);text-transform:lowercase;color:var(--muted)}
.code-copy{background:transparent;border:1px solid var(--line);color:var(--text2);border-radius:8px;padding:2px 10px;font-size:12px}
.code-copy:hover{background:var(--surface3);color:var(--text)}
pre.codeblock code{display:block;overflow-x:auto;padding:12px 14px;font:13px/1.55 var(--mono);background:none;border:0;border-radius:0;white-space:pre;tab-size:2}
.tk-c{color:var(--tk-c);font-style:italic}.tk-s{color:var(--tk-s)}.tk-k{color:var(--tk-k)}.tk-n{color:var(--tk-n)}.tk-f{color:var(--tk-f)}.tk-t{color:var(--tk-t)}
.bubble.cursor::after{content:"";display:inline-block;width:8px;height:1.05em;margin-left:3px;vertical-align:text-bottom;background:var(--accent2);border-radius:2px;animation:blink 1s steps(2) infinite}
@keyframes blink{50%{opacity:0}}
.typing{display:inline-flex;gap:5px;padding:4px 2px}
.typing i,.dots i{width:7px;height:7px;border-radius:50%;background:var(--muted);animation:bounce 1.2s infinite ease-in-out}
.typing i:nth-child(2),.dots i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3),.dots i:nth-child(3){animation-delay:.3s}
@keyframes bounce{0%,60%,100%{transform:translateY(0);opacity:.5}30%{transform:translateY(-5px);opacity:1}}
.think{border:1px solid var(--line);border-radius:12px;background:var(--surface2);font-size:13.5px;overflow:hidden}
.think summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:8px;padding:7px 12px;color:var(--text2);font-weight:600;user-select:none}
.think summary::-webkit-details-marker{display:none}
.think summary::before{content:"";width:7px;height:7px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(-45deg);transition:transform .15s;flex:none;margin-right:2px}
.think[open] summary::before{transform:rotate(45deg)}
.think .dots{display:none;gap:3px}.think.live .dots{display:inline-flex}.think .dots i{width:5px;height:5px}
.think-body{padding:2px 14px 12px;color:var(--text2);max-height:320px;overflow:auto;border-top:1px dashed var(--line)}
.think-body p{margin:.5em 0}
.status{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--text2);padding:6px 12px;border-radius:10px;background:var(--surface2);border:1px solid var(--line);align-self:flex-start;flex-wrap:wrap}
.status.retry,.status.wait{color:var(--warn);border-color:#fbbf2444;background:#fbbf2410}
.spin{width:14px;height:14px;border-radius:50%;border:2px solid var(--line2);border-top-color:var(--accent2);animation:spin .8s linear infinite;flex:none}
@keyframes spin{to{transform:rotate(360deg)}}
.pbar{flex:1;min-width:120px;height:5px;border-radius:5px;background:var(--surface3);overflow:hidden}
.pbar i{display:block;height:100%;background:linear-gradient(90deg,var(--accent),var(--accent2));transition:width .3s}
.msg-actions{display:flex;gap:4px;opacity:0;transition:opacity .15s;min-height:26px}
.msg:hover .msg-actions,.msg:focus-within .msg-actions,.msg:last-child .msg-actions{opacity:1}
@media (hover:none){.msg-actions{opacity:1}}
.msg.user .msg-actions{justify-content:flex-end}
.act{display:inline-flex;align-items:center;gap:6px;background:transparent;border:1px solid transparent;color:var(--muted);border-radius:8px;padding:3px 8px;font-size:12.5px}
.act:hover{background:var(--surface2);border-color:var(--line);color:var(--text)}
.act.done{color:var(--ok)}
.meta{font-size:12px;color:var(--muted);min-height:0}
.meta:empty{display:none}
.busy .msg-actions .act[data-act=regen],.busy .msg-actions .act[data-act=edit]{display:none}

/* ----- пустое состояние ----- */
.empty{margin:auto;padding:28px 0 12px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:8px;animation:rise .4s ease both}
.hero-logo{width:68px;height:68px;border-radius:22px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,var(--accent),var(--accent2));box-shadow:0 14px 40px -12px var(--accent);margin-bottom:6px}
.empty h2{margin:0;font-size:26px;letter-spacing:-.02em}
.empty p{margin:0;color:var(--muted);max-width:520px}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:20px;width:100%;max-width:820px}
.card-btn{display:flex;gap:12px;align-items:flex-start;text-align:left;padding:12px 14px;background:var(--surface);border:1px solid var(--line);border-radius:14px;transition:transform .15s,border-color .15s,background .15s,box-shadow .15s}
.card-btn:hover{transform:translateY(-2px);border-color:var(--accent);box-shadow:var(--shadow-s);background:var(--surface2)}
.card-btn .ci{font-size:20px;line-height:1.2}
.card-btn .ct{display:flex;flex-direction:column;min-width:0}
.card-btn b{font-size:13.5px}
.card-btn .ct span{font-size:12.5px;color:var(--muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.4}

/* ----- композер ----- */
.composer{padding:6px 16px calc(14px + env(safe-area-inset-bottom));background:linear-gradient(180deg,transparent,color-mix(in srgb,var(--bg) 85%,transparent) 30%)}
.composer-card{max-width:820px;margin:0 auto;background:var(--surface);border:1px solid var(--line2);border-radius:22px;padding:10px 12px 8px 16px;box-shadow:var(--shadow);transition:border-color .15s,box-shadow .15s}
.composer-card:focus-within{border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft),var(--shadow)}
#input{display:block;width:100%;border:0;outline:0;background:transparent;resize:none;line-height:1.55;padding:4px 0;max-height:40vh;min-height:52px;font-size:15.5px}
#input::placeholder{color:var(--muted)}
.composer-bar{display:flex;align-items:center;gap:10px;margin-top:2px}
.composer-hint{flex:1;font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.composer-hint::after{content:"Enter — отправить · Shift+Enter — новая строка"}
.est{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}
.send-btn{flex:none;width:42px;height:42px;border-radius:50%;border:0;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,var(--accent),#5b8cff);box-shadow:0 6px 18px -6px var(--accent);transition:transform .12s,filter .15s}
.send-btn:hover{filter:brightness(1.1);transform:scale(1.05)}
.send-btn:active{transform:scale(.96)}
.send-btn.stop{background:var(--text);color:var(--bg);box-shadow:none}

/* ----- popover / sheet ----- */
.popover{position:fixed;z-index:60;background:var(--surface);border:1px solid var(--line2);border-radius:16px;box-shadow:var(--shadow);display:flex;flex-direction:column;overflow:hidden;animation:pop .14s ease both;padding:8px}
@keyframes pop{from{opacity:0;transform:translateY(-4px) scale(.98)}to{opacity:1;transform:none}}
.pop-title{display:flex;align-items:center;justify-content:space-between;padding:6px 8px 8px;font-weight:650;font-size:14px}
.pop-search{margin:0 0 8px}
.popover .chips{display:flex;gap:6px;padding:0 0 8px}
.chip{border:1px solid var(--line);background:var(--surface2);color:var(--text2);border-radius:99px;padding:3px 12px;font-size:12.5px}
.chip.on{background:var(--accent-soft);border-color:var(--accent);color:var(--text)}
.pop-scroll{overflow-y:auto;min-height:0;flex:1;display:flex;flex-direction:column;gap:2px;scrollbar-width:thin;scrollbar-color:var(--line2) transparent;overscroll-behavior:contain}
.pop-group{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:700;padding:10px 10px 4px}
.pop-empty{padding:20px;text-align:center;color:var(--muted)}
.pop-foot{padding:8px 8px 2px}
.prov-item,.model-item{display:flex;align-items:center;gap:10px;width:100%;text-align:left;background:none;border:1px solid transparent;border-radius:11px;padding:8px 10px;transition:background .12s}
.prov-item:hover,.model-item:hover,.prov-item:focus-visible,.model-item:focus-visible{background:var(--surface2)}
.prov-item.sel,.model-row.sel{background:var(--accent-soft)}
.check{color:var(--accent);font-weight:700}
.model-row{display:flex;align-items:center;border-radius:11px}
.model-row .model-item{flex:1;min-width:0}
.star{flex:none;width:34px;height:34px;border-radius:9px;border:0;background:none;color:var(--muted);font-size:17px}
.star.on{color:var(--warn)}.star:hover{background:var(--surface3)}
.pop-refresh{margin-left:auto}
.popover.wide .pop-scroll{min-height:180px}
.scrim{position:fixed;inset:0;background:#00000080;opacity:0;pointer-events:none;transition:opacity .2s;z-index:40}
.scrim.show,.scrim.sheet{opacity:1;pointer-events:auto}
.scrim.sheet:not(.show){background:#00000066;z-index:55}

/* ----- toast / dialog ----- */
.toasts{position:fixed;left:50%;bottom:calc(96px + env(safe-area-inset-bottom));transform:translateX(-50%);display:flex;flex-direction:column;gap:8px;align-items:center;z-index:90;pointer-events:none;width:min(92vw,520px)}
.toast{background:var(--text);color:var(--bg);padding:9px 16px;border-radius:12px;font-size:13.5px;box-shadow:var(--shadow);opacity:0;transform:translateY(8px);transition:opacity .2s,transform .2s;max-width:100%}
.toast.in{opacity:1;transform:none}
.toast.err{background:var(--err);color:#fff}
dialog.dialog{border:1px solid var(--line2);border-radius:18px;background:var(--surface);color:var(--text);padding:0;max-width:min(460px,92vw);box-shadow:var(--shadow)}
dialog.dialog::backdrop{background:#000000a0;backdrop-filter:blur(3px)}
dialog.dialog form{padding:20px;display:flex;flex-direction:column;gap:12px}
dialog.dialog h2{margin:0;font-size:18px}
.dialog-body p{margin:.4em 0}
.dialog-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:6px}

/* ----- адаптив ----- */
@media (max-width:1100px){:root{--sbw:312px}.cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:820px){
  .app,.app.collapsed{grid-template-columns:minmax(0,1fr)}
  .app.collapsed .sidebar{visibility:visible;opacity:1;transform:none}
  .only-mobile{display:inline-grid}
  .sidebar{position:fixed;z-index:50;left:0;top:0;bottom:0;width:min(88vw,360px);transform:translateX(-102%);box-shadow:var(--shadow);padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom);border-right:1px solid var(--line2)}
  .sidebar.open{transform:none}
  .app.collapsed .sidebar{transform:translateX(-102%)}
  .app.collapsed .sidebar.open{transform:none}
  .panels.two{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) minmax(0,1fr)}
  .panels.two .panel + .panel{border-left:0;border-top:1px solid var(--line)}
  .topbar{padding:8px 10px;padding-top:max(8px,env(safe-area-inset-top))}
  .messages{padding:14px 12px 6px;gap:14px}
  .avatar{width:30px;height:30px;border-radius:10px}
  .msg{gap:9px}
  .cards{grid-template-columns:1fr}
  .empty h2{font-size:22px}
  .composer{padding:4px 10px calc(10px + env(safe-area-inset-bottom))}
  .composer-hint{display:none}
  .composer-bar{justify-content:flex-end}
  #input{font-size:16px}  /* iOS: без автозума */
  .field,select.field,input.field,textarea.field{font-size:16px}
  .popover.sheet{left:0!important;right:0;bottom:0!important;top:auto!important;width:100%!important;max-height:80dvh!important;border-radius:20px 20px 0 0;padding-bottom:calc(8px + env(safe-area-inset-bottom));animation:sheet .22s ease both}
  @keyframes sheet{from{transform:translateY(40px);opacity:.6}to{transform:none;opacity:1}}
  .toasts{bottom:calc(110px + env(safe-area-inset-bottom))}
  .chat-tools{display:flex}
  .banner{margin:8px 10px 0}
  .msg.user .bubble{max-width:100%}
  .jump{right:12px}
}
@media (max-width:420px){.cur-text small{display:none}.cur-text em{display:none}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}
@media (forced-colors:active){.btn,.picker,.composer-card{border:1px solid ButtonText}}
@media print{.sidebar,.composer,.topbar{display:none}body{overflow:visible}.app{display:block;height:auto}.messages{overflow:visible}}
/* крупные зоны нажатия на сенсорных экранах */
@media (pointer:coarse){.act{padding:8px 12px;min-height:38px}.code-copy{padding:7px 12px;min-height:34px}.chat-tools button{min-width:36px;min-height:36px}}

/* --- вложения-картинки --- */
.attach-btn{flex:none;width:36px;height:36px;border-radius:50%;border:0;background:transparent;color:var(--muted);display:grid;place-items:center;transition:background .15s,color .15s}
.attach-btn:hover{background:var(--surface2);color:var(--text)}
.attach-strip{display:flex;gap:8px;flex-wrap:wrap;padding:2px 0 8px}
.att{position:relative;width:64px;height:64px;border-radius:12px;overflow:hidden;border:1px solid var(--line2);background:var(--surface2)}
.att img{width:100%;height:100%;object-fit:cover;display:block}
.att button{position:absolute;top:3px;right:3px;width:20px;height:20px;border-radius:50%;border:0;background:#000c;color:#fff;font-size:13px;line-height:1;display:grid;place-items:center;padding:0;cursor:pointer}
.att button:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.msg-imgs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:6px;justify-content:flex-end}
.msg-imgs img{max-width:180px;max-height:140px;border-radius:12px;display:block;border:1px solid var(--line2)}
.msg-imgs .lost{font-size:12px;opacity:.8}
.composer-card.drag{border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}

.act.on{color:var(--accent);background:var(--accent-soft)}

/* =====================================================================================================
   КИБЕР-ПАНК  —  :root.cyber (включается кнопкой «⚡ Кибер-панк» в шапке; всегда поверх тёмной темы,
   data-theme при этом = dark). Чистый CSS без внешних шрифтов. Выключение возвращает выбранную тему.
   ===================================================================================================== */

/* --- кнопка в шапке (видна во ВСЕХ темах) --- */
.cyber-btn{flex:none;display:inline-flex;align-items:center;gap:7px;height:38px;padding:0 13px 0 11px;margin-right:4px;border-radius:11px;cursor:pointer;
  font:700 12.5px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;color:#fff;
  border:1.5px solid transparent;
  background:linear-gradient(#170a30,#170a30) padding-box,linear-gradient(120deg,#ff2bd6,#00f0ff 55%,#fcee0a) border-box;
  box-shadow:0 0 14px -3px #ff2bd6aa,0 0 18px -6px #00f0ff;transition:box-shadow .2s,transform .1s,filter .2s}
.cyber-btn svg{color:#fcee0a;filter:drop-shadow(0 0 4px #fcee0a)}
.cyber-btn:hover{filter:brightness(1.18);box-shadow:0 0 20px -2px #ff2bd6,0 0 26px -4px #00f0ff}
.cyber-btn:active{transform:translateY(1px)}
.cyber-btn:focus-visible{outline:2px solid #fcee0a;outline-offset:3px;border-radius:11px}
.cyber-btn[aria-pressed=true]{background:linear-gradient(120deg,#ff2bd6,#c58bff 50%,#00f0ff) padding-box,linear-gradient(120deg,#fcee0a,#ff2bd6,#00f0ff) border-box;color:#07040f;box-shadow:0 0 20px -2px #ff2bd6,0 0 30px -4px #00f0ff}
.cyber-btn[aria-pressed=true] svg{color:#07040f;filter:none}
@media (max-width:560px){
  .cyber-btn{width:38px;padding:0;justify-content:center;margin-right:0}
  .cyber-btn .cb-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
}

:root.cyber{
  --bg:#07040f;--bg2:#0b0718;--surface:#110a24;--surface2:#190f33;--surface3:#23164a;--line:#3a2a6b;--line2:#5a3fa0;
  --text:#efeaff;--text2:#d3caf7;--muted:#a99fd9;
  --accent:#ff2bd6;--accent2:#00f0ff;--accent-ink:#07040f;--accent-soft:#ff2bd624;
  --ok:#39ff9a;--warn:#fcee0a;--err:#ff6b8b;--info:#5ac8ff;
  --mag:#ff2bd6;--cya:#00f0ff;--yel:#fcee0a;--grn:#39ff9a;--void:#07040f;
  --user-bg:linear-gradient(135deg,#3a1058,#1e0b42);--user-ink:#fff;
  --code-bg:#03020a;--code-head:#0c0720;
  --shadow:0 0 0 1px #ff2bd633,0 14px 50px #000c;--shadow-s:none;
  --glow:radial-gradient(1000px 600px at 92% -10%,#3a0f5f 0%,transparent 60%),radial-gradient(800px 560px at -8% 108%,#06304a 0%,transparent 62%);
  --radius:0px;--radius-s:0px;
  --disp:"Orbitron","Rajdhani","Bahnschrift","DIN Alternate","Eurostile","Agency FB","Share Tech Mono","Cascadia Mono",ui-monospace,"SF Mono",Menlo,Consolas,"DejaVu Sans Mono",monospace;
  --sans:"Cascadia Mono","Cascadia Code","JetBrains Mono","Fira Code","SF Mono",ui-monospace,Menlo,Consolas,"DejaVu Sans Mono","Liberation Mono",monospace;
  --tk-c:#9a8fd0;--tk-s:#39ff9a;--tk-k:#ff6ae6;--tk-n:#ffb02e;--tk-f:#19e6ff;--tk-t:#fcee0a;
  --c:10px;--edge:var(--line2);
}
.cyber body{font-size:14px;letter-spacing:.005em}
.cyber ::selection{background:#ff2bd6;color:#07040f;text-shadow:none}
.cyber :focus-visible{outline:2px solid var(--yel);outline-offset:-3px;border-radius:0}  /* внутрь: clip-path обрезал бы внешний контур */
.cyber a{color:var(--cya);text-shadow:0 0 8px #00f0ff66}

/* --- анимированный фон: сетка + сканлайны + виньетка --- */
.cyber body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background-image:linear-gradient(#ff2bd61c 1px,transparent 1px),linear-gradient(90deg,#00f0ff16 1px,transparent 1px);
  background-size:48px 48px;animation:cy-grid 7s linear infinite;
  -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 38%,#000 100%);mask-image:linear-gradient(180deg,transparent 0,#000 38%,#000 100%)}
.cyber body::after{content:"";position:fixed;inset:0;z-index:999;pointer-events:none;
  background:repeating-linear-gradient(0deg,#00000030 0 1px,transparent 1px 3px),linear-gradient(180deg,transparent,#00f0ff10 50%,transparent) 0 -240px/100% 240px no-repeat,radial-gradient(ellipse at center,transparent 58%,#00000075 100%);
  animation:cy-scan 9s linear infinite}
@keyframes cy-grid{to{background-position:0 48px,48px 0}}
@keyframes cy-scan{to{background-position:0 0,0 100vh,0 0}}

/* --- угловые срезы (clip-path) + неоновая линия по срезу. --edge задаёт цвет рамки --- */
.cyber :is(.btn,.picker,.card-btn,.switch,.group,.slot,.tabs,.popover,.menu,.think,.status,.banner,.toast,dialog.dialog,.chat-item,.chip,.badge,.kbd,input.field,select.field,.keybox,.code-copy,.att,.jump,.table-wrap,pre.codeblock,.msg .bubble,.panel-head .slot-tag,.slot-tag,.cur){
  --cut:linear-gradient(135deg,transparent calc(var(--c)*.7071),var(--edge) 0 calc(var(--c)*.7071 + 1.5px),transparent 0) 0 0/calc(var(--c) + 3px) calc(var(--c) + 3px) no-repeat,
        linear-gradient(-45deg,transparent calc(var(--c)*.7071),var(--edge) 0 calc(var(--c)*.7071 + 1.5px),transparent 0) 100% 100%/calc(var(--c) + 3px) calc(var(--c) + 3px) no-repeat;
  --cutm:linear-gradient(-135deg,transparent calc(var(--c)*.7071),var(--edge) 0 calc(var(--c)*.7071 + 1.5px),transparent 0) 100% 0/calc(var(--c) + 3px) calc(var(--c) + 3px) no-repeat,
        linear-gradient(45deg,transparent calc(var(--c)*.7071),var(--edge) 0 calc(var(--c)*.7071 + 1.5px),transparent 0) 0 100%/calc(var(--c) + 3px) calc(var(--c) + 3px) no-repeat;
  clip-path:polygon(var(--c) 0,100% 0,100% calc(100% - var(--c)),calc(100% - var(--c)) 100%,0 100%,0 var(--c));
  border-radius:0;border-color:var(--edge)}
.cyber :is(.chip,.badge,.slot-tag,.code-copy,.att,.jump,.kbd){--c:5px}
.cyber :is(.tabs,.switch,.chat-item,.cur,input.field,select.field,.keybox,.status,.banner,.toast,.think,.menu){--c:8px}
.cyber :is(.group,.slot,.popover,.card-btn,.msg .bubble,dialog.dialog,pre.codeblock,.table-wrap){--c:16px}

/* --- типографика --- */
.cyber :is(h1,h2,h3,.lbl,.slot-title,.pop-title,.pop-group,.tabs button,.btn,.chip,.badge,.code-head .lang,.who .name,.pi-text b,.card-btn b,.cur-text b,dialog h2){font-family:var(--disp)}
.cyber .lbl,.cyber .pop-group{color:var(--cya);letter-spacing:.14em;text-shadow:0 0 8px #00f0ff55}
.cyber .btn,.cyber .tabs button,.cyber .chip{text-transform:uppercase;letter-spacing:.07em;font-weight:700;font-size:12px}
.cyber .btn.small{font-size:11px}
.cyber .hint,.cyber .muted{color:var(--muted)}
.cyber .hint b{color:var(--yel)}
.cyber code{color:#ff9af0}
.cyber kbd{font-family:var(--mono);background:#0b0718;border:1px solid var(--cya);border-bottom-width:2px;border-radius:0;color:var(--cya);box-shadow:0 0 8px -3px var(--cya)}

/* --- логотип и заголовки: неон + глитч --- */
.cyber .logo,.cyber .hero-logo{border-radius:0;color:#07040f;background:linear-gradient(135deg,var(--cya),var(--mag));clip-path:polygon(25% 3%,75% 3%,98% 50%,75% 97%,25% 97%,2% 50%);box-shadow:none}
.cyber .logo{filter:drop-shadow(0 0 7px #ff2bd6aa)}
.cyber .hero-logo{filter:drop-shadow(0 0 16px #ff2bd6cc) drop-shadow(0 0 30px #00f0ff88);animation:cy-pulse 3.2s ease-in-out infinite}
@keyframes cy-pulse{50%{filter:drop-shadow(0 0 9px #ff2bd6aa) drop-shadow(0 0 40px #00f0ffaa)}}
.cyber .brand h1,.cyber .empty h2{position:relative;display:inline-block;color:#fff;text-transform:uppercase;letter-spacing:.09em;font-weight:800;text-shadow:0 0 6px #00f0ffcc,0 0 18px #00f0ff88,0 0 34px #ff2bd666}
.cyber .brand h1{font-size:17px}
.cyber .empty h2{font-size:30px}
.cyber .brand h1::before,.cyber .brand h1::after,.cyber .empty h2::before,.cyber .empty h2::after{content:attr(data-text);content:attr(data-text) / "";position:absolute;left:0;top:0;width:100%;height:100%;overflow:hidden;white-space:nowrap;pointer-events:none}
.cyber .brand h1::before,.cyber .empty h2::before{color:var(--mag);text-shadow:none;animation:cy-g1 5s steps(1) infinite}
.cyber .brand h1::after,.cyber .empty h2::after{color:var(--cya);text-shadow:none;animation:cy-g2 5s steps(1) infinite .13s}
@keyframes cy-g1{0%,87%,100%{clip-path:inset(0 0 100% 0);transform:none}88%{clip-path:inset(8% 0 62% 0);transform:translate(-4px,0)}90%{clip-path:inset(58% 0 12% 0);transform:translate(3px,0)}92%{clip-path:inset(30% 0 40% 0);transform:translate(-2px,0)}94%{clip-path:inset(0 0 100% 0)}}
@keyframes cy-g2{0%,87%,100%{clip-path:inset(0 0 100% 0);transform:none}89%{clip-path:inset(45% 0 25% 0);transform:translate(4px,0)}91%{clip-path:inset(12% 0 70% 0);transform:translate(-3px,0)}93%{clip-path:inset(72% 0 4% 0);transform:translate(2px,0)}95%{clip-path:inset(0 0 100% 0)}}
.cyber .brand p{color:var(--mag);font-family:var(--mono);font-size:11px;letter-spacing:.05em;text-shadow:0 0 8px #ff2bd655}
.cyber .empty p{color:var(--text2)}

/* --- боковая панель --- */
.cyber .sidebar{background:linear-gradient(180deg,#0d0820f2,#07040ff2);border-right:1px solid #00f0ff66;box-shadow:1px 0 22px -4px #00f0ff55,inset -1px 0 0 #ff2bd633}
.cyber .tabs{background:#0a0618;border:1px solid var(--line);padding:3px}
.cyber .tabs button{border-radius:0;color:var(--muted);position:relative}
.cyber .tabs button:hover{color:#fff;text-shadow:0 0 8px var(--cya)}
.cyber .tabs button[aria-selected=true]{background:linear-gradient(180deg,#ff2bd62e,#ff2bd60d);color:#fff;box-shadow:inset 0 -2px 0 var(--mag),0 0 12px -4px var(--mag);text-shadow:0 0 8px var(--mag)}
.cyber .group,.cyber .slot{--edge:#3a2a6b;background:var(--cut),linear-gradient(160deg,#130b28,#0c0719);border:1px solid var(--edge);box-shadow:inset 0 0 22px -12px var(--mag)}
.cyber .slot-tag{border-radius:0;background:var(--mag);color:#07040f;font-family:var(--disp);box-shadow:0 0 10px var(--mag)}
.cyber .slot-tag.b{background:var(--cya);color:#07040f;box-shadow:0 0 10px var(--cya)}
.cyber .field,.cyber select.field,.cyber input.field,.cyber textarea.field{--edge:#4a3590;background:var(--cut),#0a0618;border:1px solid var(--edge);border-radius:0;font-family:var(--mono);color:#fff}
.cyber textarea.field{background:#0a0618;border-left:3px solid var(--edge)}
.cyber .field:focus{--edge:var(--cya);border-color:var(--cya);box-shadow:0 0 0 1px #00f0ff55,0 0 16px -3px var(--cya),inset 0 0 12px -6px var(--cya)}
.cyber .field::placeholder{color:#9d92cf}
.cyber select.field option{background:#0a0618}
.cyber input[type=range]{accent-color:var(--mag)}
.cyber output{color:var(--yel);font-family:var(--mono);text-shadow:0 0 8px #fcee0a77}

/* --- кнопки --- */
.cyber .btn{--edge:#5a3fa0;background:var(--cut),linear-gradient(180deg,#1b1038,#120a26);border:1px solid var(--edge);color:#efeaff;box-shadow:inset 0 0 14px -8px var(--mag)}
.cyber .btn:hover,.cyber .btn:focus-visible{--edge:var(--cya);color:#fff;background:var(--cut),linear-gradient(180deg,#1f1446,#140b2c);box-shadow:inset 0 0 18px -6px var(--cya);text-shadow:0 0 8px var(--cya);animation:cy-flick .45s steps(1) 1}
.cyber .btn.ghost{background:var(--cut),transparent}
.cyber .btn.primary{--edge:#ff7be9;background:var(--cut),linear-gradient(120deg,#ff2bd6,#9b3bff 55%,#00c8ff);color:#07040f;border:1px solid var(--edge);font-weight:800;text-shadow:none;box-shadow:inset 0 0 16px -6px #fff}
.cyber .btn.primary:hover{filter:brightness(1.12);color:#07040f;text-shadow:none;--edge:#fff}
.cyber .btn.primary kbd{background:#07040f33;border-color:#07040f88;color:#07040f;box-shadow:none}
.cyber .btn.danger{background:var(--cut),var(--err);color:#07040f}
.cyber .danger-text{color:var(--err)}
@keyframes cy-flick{0%{opacity:1}12%{opacity:.45}24%{opacity:1}38%{opacity:.6}52%{opacity:1}70%{opacity:.8}100%{opacity:1}}
.cyber .icon-btn{border-radius:0;color:var(--text2)}
.cyber .icon-btn:hover{background:#ff2bd61a;border-color:var(--mag);color:#fff;box-shadow:0 0 12px -3px var(--mag);animation:cy-flick .45s steps(1) 1}
.cyber .icon-btn:focus-visible{outline-offset:1px}
.cyber .cyber-btn{clip-path:polygon(9px 0,100% 0,100% calc(100% - 9px),calc(100% - 9px) 100%,0 100%,0 9px);border-radius:0;animation:cy-neon 2.6s ease-in-out infinite}
.cyber .cyber-btn:focus-visible{outline:2px solid var(--yel);outline-offset:-5px;border-radius:0}
@keyframes cy-neon{50%{box-shadow:0 0 30px -2px #ff2bd6,0 0 40px -4px #00f0ff}}

/* --- селекторы, бейджи, точки --- */
.cyber .picker{--edge:#4a3590;background:var(--cut),linear-gradient(180deg,#160d2e,#0f0820);border:1px solid var(--edge);box-shadow:inset 0 0 16px -10px var(--cya)}
.cyber .picker:hover{--edge:var(--cya);background:var(--cut),#1a1038;animation:cy-flick .45s steps(1) 1}
.cyber .picker[aria-expanded=true]{--edge:var(--mag);box-shadow:inset 0 0 18px -6px var(--mag)}
.cyber .chev{border-color:var(--cya)}
.cyber .plogo{border-radius:0;clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);box-shadow:none;color:#07040f;font-family:var(--disp)}
.cyber .dot{box-shadow:0 0 8px currentColor}
.cyber .dot.ok{background:var(--ok);box-shadow:0 0 9px var(--ok)}
.cyber .dot.limited{background:var(--info);box-shadow:0 0 9px var(--info)}
.cyber .dot.flaky{background:var(--warn);box-shadow:0 0 9px var(--warn)}
.cyber .dot.fail{background:var(--err);box-shadow:0 0 9px var(--err)}
.cyber .badge{--edge:#5a3fa0;background:var(--cut),#0c0720;border:1px solid var(--edge);color:var(--text2);font-size:11px;letter-spacing:.05em;padding:2px 9px;line-height:1.5}
.cyber .badge.ok{--edge:#39ff9a;color:var(--ok);background:var(--cut),#39ff9a14;box-shadow:inset 0 0 10px -5px var(--ok)}
.cyber .badge.warn{--edge:#fcee0a;color:var(--warn);background:var(--cut),#fcee0a12}
.cyber .badge.key{--edge:var(--mag);color:#ff8df0;background:var(--cut),#ff2bd61a}
.cyber .progress,.cyber .pbar{border-radius:0;background:#0a0618;border:1px solid var(--line)}
.cyber .progress .bar,.cyber .pbar i{background:linear-gradient(90deg,var(--mag),var(--cya),var(--yel));box-shadow:0 0 12px var(--cya)}
.cyber .keybox{--edge:#4a3590;background:var(--cut),transparent;border:1px dashed var(--edge)}
.cyber .keybox summary{font-family:var(--disp);text-transform:uppercase;letter-spacing:.06em;font-size:12px;color:var(--text)}
.cyber #healthSumA.stale{color:var(--warn)}

/* --- переключатели --- */
.cyber .switch{--edge:#3a2a6b;background:var(--cut),linear-gradient(160deg,#130b28,#0c0719);border:1px solid var(--edge)}
.cyber .sw{border-radius:0;background:#0a0618;border:1px solid var(--line2);clip-path:polygon(5px 0,100% 0,100% calc(100% - 5px),calc(100% - 5px) 100%,0 100%,0 5px)}
.cyber .sw::after{border-radius:0;background:var(--muted);top:3px;left:3px;width:14px;height:14px}
.cyber .switch input:checked + .sw{background:#ff2bd633;border-color:var(--mag);box-shadow:inset 0 0 10px -2px var(--mag)}
.cyber .switch input:checked + .sw::after{background:var(--mag);box-shadow:0 0 10px var(--mag),0 0 18px var(--mag)}
.cyber .switch input:focus-visible + .sw{outline-color:var(--yel)}

/* --- список чатов --- */
.cyber .chat-item{--edge:transparent;border:1px solid var(--edge)}
.cyber .chat-item:hover,.cyber .chat-item:focus-within{--edge:#00f0ff88;background:#00f0ff0f}
.cyber .chat-item.cur{--edge:var(--mag);background:linear-gradient(90deg,#ff2bd633,#ff2bd60a);box-shadow:inset 3px 0 0 var(--mag),inset 0 0 18px -8px var(--mag)}
.cyber .ct-title{color:#fff}
.cyber .chat-tools button{filter:none;opacity:.9;color:var(--text2)}

/* --- шапка --- */
.cyber .topbar{background:linear-gradient(180deg,#0b0718f0,#07040fcc);border-bottom:1px solid transparent;border-image:linear-gradient(90deg,var(--mag),var(--cya) 60%,var(--yel)) 1;box-shadow:0 6px 24px -10px #ff2bd6aa}
.cyber .cur{--edge:transparent;background:transparent;border:1px solid var(--edge)}
.cyber .cur:hover{--edge:var(--cya);background:#00f0ff10}
.cyber .cur-text b{letter-spacing:.06em;text-transform:uppercase;font-size:13px;color:#fff;text-shadow:0 0 8px #00f0ff77}
.cyber .cur-text small,.cyber .cur-text em{color:var(--muted)}
.cyber .menu{--edge:var(--cya);background:var(--cut),#0b0718;border:1px solid var(--edge);box-shadow:inset 0 0 20px -10px var(--cya)}
.cyber .menu button{border-radius:0;font-family:var(--mono)}
.cyber .menu button:hover,.cyber .menu button:focus-visible{background:#00f0ff1c;color:#fff;box-shadow:inset 3px 0 0 var(--cya)}
.cyber .banner{--edge:#fcee0a;background:var(--cut),#fcee0a12;border:1px solid var(--edge);color:var(--warn)}
.cyber .banner.warn{color:#fff6a0}
.cyber .banner.err{--edge:var(--err);background:var(--cut),#ff6b8b14;color:#ffb3c4}
.cyber .banner.ok{--edge:var(--ok);background:var(--cut),#39ff9a12;color:var(--ok)}

/* --- панели сравнения --- */
.cyber .panel-head{background:linear-gradient(90deg,#ff2bd61a,#00f0ff10);border-bottom:1px solid #ff2bd655;color:var(--text2);font-family:var(--mono)}
.cyber .panel-head .plabel b{color:#fff;font-family:var(--disp);letter-spacing:.05em}
.cyber .panels.two .panel + .panel{border-left:0;position:relative}
.cyber .panels.two .panel + .panel::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;z-index:4;pointer-events:none;background:linear-gradient(180deg,var(--mag),var(--cya),var(--mag));background-size:100% 300%;animation:cy-line 5s linear infinite;box-shadow:0 0 14px var(--mag),0 0 24px #00f0ff88}
@keyframes cy-line{to{background-position:0 300%}}
@media (max-width:820px){
  .cyber .panels.two .panel + .panel{border-top:0}
  .cyber .panels.two .panel + .panel::before{left:0;right:0;top:0;bottom:auto;width:auto;height:2px;background:linear-gradient(90deg,var(--mag),var(--cya),var(--mag));background-size:300% 100%;animation-name:cy-line-x}
}
@keyframes cy-line-x{to{background-position:300% 0}}

/* --- сообщения --- */
.cyber .messages{scrollbar-width:auto}
.cyber .avatar{border-radius:0;clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);background:#170f33;color:var(--text2);border:0}
.cyber .msg.user .avatar{background:linear-gradient(135deg,var(--mag),#8b3dff);color:#07040f}
.cyber .msg.assistant .avatar{background:linear-gradient(135deg,hsl(var(--h,260) 100% 62%),hsl(calc(var(--h,260) + 60) 100% 55%));color:#07040f}
.cyber .who .name{letter-spacing:.07em;text-transform:uppercase;font-size:12px}
.cyber .msg.user .who .name{color:var(--mag);text-shadow:0 0 10px #ff2bd688}
.cyber .msg.assistant .who .name{color:var(--cya);text-shadow:0 0 10px #00f0ff77}
.cyber .who .time{color:var(--muted);font-family:var(--mono)}
.cyber .msg.user .bubble{--edge:var(--mag);--c:14px;background:var(--cutm),linear-gradient(135deg,#3d1160,#1f0c45);color:#fff;border:1px solid var(--edge);border-right:3px solid var(--mag);border-radius:0;padding:10px 16px;
  clip-path:polygon(0 0,calc(100% - var(--c)) 0,100% var(--c),100% 100%,var(--c) 100%,0 calc(100% - var(--c)));box-shadow:inset 0 0 26px -10px var(--mag),inset -10px 0 18px -12px var(--mag)}
.cyber .msg.assistant .bubble{--edge:#00f0ffb0;background:var(--cut),linear-gradient(160deg,#0d1533,#0a0a24);border:1px solid var(--edge);border-left:3px solid var(--cya);border-radius:0;padding:12px 18px;box-shadow:inset 0 0 26px -12px var(--cya),inset 10px 0 18px -12px var(--cya)}
.cyber .msg.assistant .bubble.err{--edge:var(--err);background:var(--cut),linear-gradient(160deg,#2a0b1c,#15081a);border-left-color:var(--err)}
.cyber .err-ico{color:var(--err);text-shadow:0 0 8px var(--err)}
.cyber .bubble h2,.cyber .bubble h3,.cyber .bubble h4{font-family:var(--disp);color:#fff;letter-spacing:.04em;text-shadow:0 0 10px #00f0ff66}
.cyber .bubble h2{color:var(--yel);text-shadow:0 0 12px #fcee0a66}
.cyber .bubble a{color:var(--cya)}
.cyber .bubble code{background:#ff2bd61c;border:1px solid #ff2bd655;border-radius:0;color:#ffb0f3}
.cyber .bubble blockquote{border-left:3px solid var(--mag);background:linear-gradient(90deg,#ff2bd61f,transparent);border-radius:0;color:var(--text2)}
.cyber .bubble hr{border-top:1px solid transparent;border-image:linear-gradient(90deg,var(--mag),var(--cya),transparent) 1}
.cyber .bubble li::marker{color:var(--mag)}
.cyber .bubble li input[type=checkbox]{accent-color:var(--mag)}
.cyber .table-wrap{--edge:#3a2a6b;--c:10px;border:1px solid var(--edge)}
.cyber .bubble th{background:#1b1038;color:var(--cya);font-family:var(--disp);text-transform:uppercase;letter-spacing:.06em;font-size:.85em}
.cyber .bubble th,.cyber .bubble td{border-bottom:1px solid #2c2052}
.cyber .bubble.cursor::after{border-radius:0;background:var(--cya);box-shadow:0 0 10px var(--cya),0 0 20px var(--cya)}

/* индикатор набора: «эквалайзер» + строка статуса */
.cyber .typing{gap:4px;align-items:center;padding:4px 2px}
.cyber .typing i{width:8px;height:18px;border-radius:0;background:var(--cya);box-shadow:0 0 10px var(--cya);animation:cy-bar .9s steps(5) infinite;transform-origin:50% 100%;opacity:1}
.cyber .typing i:nth-child(2){background:var(--mag);box-shadow:0 0 10px var(--mag);animation-delay:.15s}
.cyber .typing i:nth-child(3){background:var(--yel);box-shadow:0 0 10px var(--yel);animation-delay:.3s}
.cyber .typing::after{content:"ОБРАБОТКА ЗАПРОСА_";margin-left:8px;font:700 11px var(--mono);letter-spacing:.14em;color:var(--cya);text-shadow:0 0 8px var(--cya);animation:blink 1s steps(2) infinite}
@keyframes cy-bar{0%,100%{transform:scaleY(.3)}50%{transform:scaleY(1)}}
.cyber .think{--edge:#8b3dff;background:var(--cut),#0d0820;border:1px solid var(--edge)}
.cyber .think summary{font-family:var(--disp);text-transform:uppercase;letter-spacing:.07em;font-size:12px;color:#d9b8ff}
.cyber .think summary::before{border-color:var(--mag)}
.cyber .think .dots i{border-radius:0;background:var(--mag);animation:cy-bar .9s steps(5) infinite;transform-origin:50% 100%;box-shadow:0 0 8px var(--mag)}
.cyber .think-body{border-top:1px dashed #8b3dff88}
.cyber .status{--edge:var(--line2);background:var(--cut),#0d0820;color:var(--text2)}
.cyber .status.retry,.cyber .status.wait{--edge:var(--warn);color:var(--warn);background:var(--cut),#fcee0a10}
.cyber .spin{border-radius:0;border:2px solid #ff2bd655;border-top-color:var(--cya);border-right-color:var(--yel);box-shadow:0 0 8px #00f0ff88}
.cyber .act{border-radius:0;color:var(--muted);font-family:var(--mono)}
.cyber .act:hover{background:#00f0ff14;border-color:var(--cya);color:#fff;animation:cy-flick .45s steps(1) 1}
.cyber .act.done{color:var(--ok)}
.cyber .act.on{color:#ff8df0;background:#ff2bd61f}
.cyber .meta{color:var(--muted);font-family:var(--mono)}

/* --- код: терминал --- */
.cyber pre.codeblock{--edge:#19e6ffa0;background:var(--cut),#03020a;border:1px solid var(--edge);box-shadow:inset 0 0 28px -14px var(--grn)}
.cyber .code-head{background:linear-gradient(90deg,#0f0a26,#0a0618);border-bottom:1px solid #19e6ff55;padding:6px 8px 6px 14px}
.cyber .code-head .lang{color:var(--grn);font-family:var(--mono);text-shadow:0 0 8px #39ff9a88;display:flex;align-items:center;gap:10px}
.cyber .code-head .lang::before{content:"";width:9px;height:9px;border-radius:50%;background:#ff5f6d;box-shadow:15px 0 0 #fcee0a,30px 0 0 #39ff9a;margin-right:32px;flex:none}
.cyber .code-copy{--edge:var(--cya);background:var(--cut),transparent;border:1px solid var(--edge);color:var(--cya);font-family:var(--mono);text-transform:uppercase;letter-spacing:.06em;font-size:11px}
.cyber .code-copy:hover{background:var(--cut),#00f0ff22;color:#fff}
.cyber pre.codeblock code{color:#c8ffe4;background:repeating-linear-gradient(0deg,transparent 0 2px,#39ff9a08 2px 3px);text-shadow:0 0 6px #39ff9a44}
.cyber .tk-c{font-style:normal;opacity:1}

/* --- пустой экран и карточки --- */
.cyber .card-btn{--edge:#3f2d7c;--c:14px;background:var(--cut),linear-gradient(160deg,#150c2e,#0c0719);border:1px solid var(--edge);box-shadow:inset 0 0 24px -14px var(--mag);transition:transform .15s,background .15s}
.cyber .card-btn:hover,.cyber .card-btn:focus-visible{--edge:var(--mag);transform:translateY(-2px);background:var(--cut),linear-gradient(160deg,#241046,#120a2a);box-shadow:inset 0 0 26px -8px var(--mag);animation:cy-flick .5s steps(1) 1}
.cyber .card-btn:focus-visible{outline-offset:-5px}
.cyber .card-btn b{text-transform:uppercase;letter-spacing:.06em;color:#fff;font-size:12.5px}
.cyber .card-btn:hover b{color:var(--yel);text-shadow:0 0 8px #fcee0a88}
.cyber .card-btn .ct span{color:var(--text2)}
.cyber .card-btn .ci{filter:drop-shadow(0 0 6px var(--cya))}

/* --- композер: анимированная неоновая рамка при фокусе --- */
.cyber .composer{background:linear-gradient(180deg,transparent,#07040fe6 35%)}
.cyber .composer-card{--c:16px;position:relative;isolation:isolate;border:0;border-radius:0;padding:12px 14px 8px 18px;box-shadow:none;
  background:linear-gradient(135deg,#ff2bd688,#00f0ff88) 0 0/100% 100%;
  clip-path:polygon(var(--c) 0,100% 0,100% calc(100% - var(--c)),calc(100% - var(--c)) 100%,0 100%,0 var(--c));transition:filter .2s}
.cyber .composer-card::before{content:"";position:absolute;inset:2px;z-index:-1;background:linear-gradient(160deg,#120a26,#09051a);
  clip-path:polygon(calc(var(--c) - 1.17px) 0,100% 0,100% calc(100% - var(--c) + 1.17px),calc(100% - var(--c) + 1.17px) 100%,0 100%,0 calc(var(--c) - 1.17px))}
.cyber .composer:focus-within{filter:drop-shadow(0 0 10px #ff2bd6aa) drop-shadow(0 0 22px #00f0ff77)}
.cyber .composer-card:focus-within,.cyber .composer-card.drag{background:linear-gradient(90deg,#ff2bd6,#00f0ff,#fcee0a,#ff2bd6,#00f0ff,#fcee0a,#ff2bd6) 0 0/300% 100%;animation:cy-border 4s linear infinite;box-shadow:none}
@keyframes cy-border{to{background-position:-300% 0}}
.cyber #input{font-family:var(--mono);color:#fff;caret-color:var(--cya)}
.cyber #input::placeholder{color:#a79dd6}
.cyber .composer-hint::after{content:"ENTER — отправить · SHIFT+ENTER — строка"}
.cyber .composer-hint,.cyber .est{font-family:var(--mono);color:var(--muted)}
.cyber .attach-btn{border-radius:0;color:var(--cya)}
.cyber .attach-btn:hover{background:#00f0ff1a;color:#fff}
.cyber .send-btn{width:46px;height:46px;border-radius:0;color:#07040f;border:0;
  background:linear-gradient(120deg,#ff2bd6,#00f0ff,#fcee0a,#ff2bd6) 0 0/300% 100%;animation:cy-border 3.5s linear infinite;
  clip-path:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px);box-shadow:none;transition:transform .12s,filter .15s}
.cyber .send-btn:hover{filter:brightness(1.2) drop-shadow(0 0 6px #fff);transform:scale(1.06);animation:cy-border 3.5s linear infinite,cy-flick .5s steps(1) 1}
.cyber .send-btn:focus-visible{outline:2px solid #fff;outline-offset:-6px}
.cyber .send-btn.stop{background:var(--yel);color:#07040f;animation:none}
.cyber .send-btn svg{filter:none}
.cyber .composer-card.drag{box-shadow:none}
.cyber .att{--edge:var(--cya);border:1px solid var(--edge);border-radius:0;background:#0a0618}
.cyber .jump{--edge:var(--cya);background:var(--cut),#0b0718;border:1px solid var(--edge);color:var(--cya);border-radius:0}

/* --- поповер выбора модели, bottom-sheet --- */
.cyber .scrim{background:#05020bb3;backdrop-filter:blur(2px)}
.cyber .popover{--edge:var(--cya);--c:16px;background:var(--cut),linear-gradient(170deg,#100a26f7,#080514f7);border:1px solid var(--edge);border-radius:0;box-shadow:inset 0 0 30px -14px var(--cya),inset 0 0 0 1px #ff2bd622;animation:cy-pop .22s steps(6) both}
@keyframes cy-pop{from{opacity:0;transform:translateY(-6px) scaleY(.96)}to{opacity:1;transform:none}}
.cyber .pop-title{font-family:var(--disp);text-transform:uppercase;letter-spacing:.1em;font-size:13px;color:#fff;text-shadow:0 0 10px var(--cya)}
.cyber .pop-title::before{content:"//";color:var(--mag);margin-right:8px}
.cyber .chip{--edge:#4a3590;background:var(--cut),#0c0720;border:1px solid var(--edge);color:var(--text2)}
.cyber .chip.on{--edge:var(--mag);background:var(--cut),#ff2bd62e;color:#fff;box-shadow:inset 0 0 10px -4px var(--mag)}
.cyber .prov-item,.cyber .model-item{border-radius:0;border-left:3px solid transparent}
.cyber .prov-item:hover,.cyber .model-item:hover,.cyber .prov-item:focus-visible,.cyber .model-item:focus-visible{background:#00f0ff14;border-left-color:var(--cya);animation:cy-flick .4s steps(1) 1}
.cyber .prov-item.sel,.cyber .model-row.sel{background:linear-gradient(90deg,#ff2bd633,#ff2bd608);box-shadow:inset 3px 0 0 var(--mag)}
.cyber .model-row{border-radius:0}
.cyber .check{color:var(--mag);text-shadow:0 0 8px var(--mag)}
.cyber .star{border-radius:0}.cyber .star.on{color:var(--yel);text-shadow:0 0 10px var(--yel)}
.cyber .pop-empty{color:var(--muted)}
.cyber .pop-scroll{scrollbar-width:auto}
@media (max-width:820px){
  .cyber .popover.sheet{border-radius:0;--c:18px;clip-path:polygon(var(--c) 0,calc(100% - var(--c)) 0,100% var(--c),100% 100%,0 100%,0 var(--c));background:linear-gradient(170deg,#100a26,#080514);border-color:var(--cya);border-bottom:0;
    box-shadow:none;animation:cy-sheet .25s steps(6) both;padding-top:14px}
  .cyber .popover.sheet::after{content:"";position:absolute;left:50%;top:6px;width:54px;height:3px;transform:translateX(-50%);background:linear-gradient(90deg,var(--mag),var(--cya));box-shadow:0 0 10px var(--mag)}
  @keyframes cy-sheet{from{transform:translateY(50px);opacity:.5}to{transform:none;opacity:1}}
  .cyber .sidebar{border-right:2px solid var(--cya);box-shadow:0 0 40px 2px #00f0ff55,14px 0 60px #ff2bd655;background:linear-gradient(180deg,#0d0820,#07040f)}
  .cyber .sidebar::after{content:"";position:absolute;top:0;right:0;bottom:0;width:2px;pointer-events:none;background:linear-gradient(180deg,var(--mag),var(--cya),var(--yel));box-shadow:0 0 14px var(--mag)}
  .cyber .messages{padding-left:10px;padding-right:10px}
  .cyber .brand h1{font-size:16px}
  .cyber .empty h2{font-size:22px}
}

/* --- toast, dialog --- */
.cyber .toast{--edge:var(--cya);background:var(--cut),#0b0718;color:#fff;border:1px solid var(--edge);border-radius:0;font-family:var(--mono);box-shadow:inset 0 0 18px -8px var(--cya)}
.cyber .toast.err{--edge:var(--err);background:var(--cut),#2a0b1c;color:#ffd0da}
.cyber dialog.dialog{--edge:var(--mag);background:var(--cut),linear-gradient(160deg,#120a26,#080514);border:1px solid var(--edge);border-radius:0;box-shadow:inset 0 0 30px -12px var(--mag)}
.cyber dialog.dialog::backdrop{background:#05020bcc}
.cyber dialog.dialog h2{text-transform:uppercase;letter-spacing:.08em;color:#fff;text-shadow:0 0 10px var(--mag)}
.cyber .skip{background:var(--yel);color:#07040f;border-radius:0}

/* --- стилизованные скроллбары (WebKit/Blink) и запасной вариант для Firefox --- */
@supports selector(::-webkit-scrollbar){
  .cyber *{scrollbar-width:auto;scrollbar-color:auto}
  .cyber ::-webkit-scrollbar{width:11px;height:11px}
  .cyber ::-webkit-scrollbar-track{background:#07040f;border-left:1px solid #2c2052}
  .cyber ::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--mag),#8b3dff 50%,var(--cya));border:2px solid #07040f;box-shadow:0 0 10px var(--mag)}
  .cyber ::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,#ff6ae6,var(--yel))}
  .cyber ::-webkit-scrollbar-corner{background:#07040f}
}
@supports not selector(::-webkit-scrollbar){.cyber *{scrollbar-width:thin;scrollbar-color:#ff2bd6 #07040f}}

/* --- короткий «глитч-вход» при включении режима --- */
.cyber.cy-boot .app{animation:cy-boot .6s steps(1) 1}
@keyframes cy-boot{0%{filter:hue-rotate(90deg) saturate(2);transform:translateX(-6px)}15%{filter:none;transform:translateX(5px) skewX(2deg)}30%{filter:hue-rotate(-60deg) contrast(1.4);transform:none}45%{filter:none;transform:translateX(-3px)}60%{filter:brightness(1.6);transform:none}100%{filter:none;transform:none}}

/* --- доступность движения: никаких анимаций и глитча --- */
@media (prefers-reduced-motion:reduce){
  .cyber *,.cyber *::before,.cyber *::after{animation:none!important;transition:none!important}
  .cyber .brand h1::before,.cyber .brand h1::after,.cyber .empty h2::before,.cyber .empty h2::after{display:none!important}
  .cyber body::after{background:repeating-linear-gradient(0deg,#00000030 0 1px,transparent 1px 3px),radial-gradient(ellipse at center,transparent 58%,#00000075 100%)}
  .cyber .composer-card:focus-within,.cyber .send-btn{background-size:100% 100%}
  .cyber .typing i{transform:scaleY(.8)}
}
@media (forced-colors:active){.cyber body::before,.cyber body::after{display:none}}

/* --- диалог согласия (журнал на сервере владельца) --- */
dialog.consent{max-width:min(500px,94vw)}
dialog.consent h2{font-size:19px}
dialog.consent .dialog-actions{flex-wrap:wrap}
dialog.consent .dialog-actions .btn{flex:1 1 150px;justify-content:center}
.cyber dialog.consent p{color:#e9e1ff}

/* --- реклама (только если в js/config.js задан ADSENSE_CLIENT и ADSENSE_SLOT) --- */
/* Плашка внизу боковой панели: пока объявление не загрузилось, высота 0 (пустого блока нет), ширина при этом нормальная. */
.ad-box{flex:none;max-height:0;overflow:hidden;visibility:hidden;margin:0 16px;padding:0;border:0 solid var(--line);border-radius:var(--radius-s);background:var(--surface);position:relative;transition:max-height .2s ease}
.ad-box.filled{max-height:130px;visibility:visible;margin:8px 16px calc(12px + env(safe-area-inset-bottom));border-width:1px;padding:16px 6px 6px}
.ad-box .ad-label{position:absolute;top:2px;left:8px;font-size:10px;line-height:14px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.ad-box ins.adsbygoogle{width:100%;max-height:100px;overflow:hidden}
.cyber .ad-box{border-radius:0;border-color:#5a3fa0;background:#0b0618}
.cyber .ad-box .ad-label{font-family:var(--mono);color:var(--cya)}
dialog.ads-consent .dialog-actions .btn{flex:1 1 180px}