/* ============================================================
   База знаний — custom chat shell. Modern AI-chat UI in the RCAI
   site design language: light, hard-edge, SZRCAI, sky accent.
   ============================================================ */
@font-face{font-family:'SZRCAI';src:url('assets/SZRCAI_wght.ttf') format('truetype');font-weight:300 800;font-display:swap;}
@font-face{font-family:'SZRCAI Mono';src:url('assets/SZRCAI_mono.ttf') format('truetype');font-weight:400 700;font-display:swap;}

:root{
  --cream:#F2F4F7;--surface:#FFFFFF;--surface-2:#F8FAFC;--surface-3:#EEF2F6;
  --navy:#1B2432;--navy-2:#343D55;--ink-2:#263246;--muted:#485475;--tagn:#5B6473;
  --sky:#479BBF;--sky-deep:#2D86AA;--sky-soft:#7FB8D0;--sky-bg:#EAF4F8;--sky-focus:#8FC9D9;
  --line:#E1E6EE;--line-2:#D7DEE8;--green:#2F7D5C;--green-bg:#E7F4ED;--amber:#A87316;--red:#DA374B;
  --font:'SZRCAI','Golos Text',Arial,sans-serif;--mono:'SZRCAI Mono',ui-monospace,monospace;
  --sb:280px;--col:760px;
}
*{box-sizing:border-box;margin:0;padding:0;}
html,body{height:100%;}
body{font-family:var(--font);background:var(--cream);color:var(--navy);
  -webkit-font-smoothing:antialiased;display:flex;overflow:hidden;}
button{font-family:var(--font);cursor:pointer;}
::-webkit-scrollbar{width:10px;height:10px;}
::-webkit-scrollbar-track{background:transparent;}
::-webkit-scrollbar-thumb{background:var(--line-2);}
::-webkit-scrollbar-thumb:hover{background:var(--sky-soft);}

/* ===================== SIDEBAR ===================== */
.sidebar{width:var(--sb);flex-shrink:0;background:var(--surface);border-right:1px solid var(--line);
  display:flex;flex-direction:column;height:100vh;}
.side-top{padding:18px 18px 12px;}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;}
.brand img{height:30px;width:auto;display:block;}
.brand .bt{font-weight:800;font-size:15px;color:var(--navy);letter-spacing:-.01em;line-height:1;}
.brand .bt small{display:block;font-family:var(--mono);font-size:9.5px;font-weight:400;color:var(--muted);letter-spacing:.06em;margin-top:4px;}

.new-chat{width:calc(100% - 36px);margin:6px 18px 10px;padding:11px 14px;border:1px solid var(--sky);
  background:var(--sky);color:#fff;font-weight:800;font-size:13.5px;display:flex;align-items:center;
  gap:9px;justify-content:center;transition:background .15s;}
.new-chat:hover{background:var(--sky-deep);border-color:var(--sky-deep);}
.new-chat svg{width:15px;height:15px;}

.history{flex:1;overflow-y:auto;padding:6px 10px 12px;}
.hgroup{font-family:var(--mono);font-size:9.5px;letter-spacing:.09em;text-transform:uppercase;
  color:var(--tagn);font-weight:700;padding:14px 8px 5px;}
.hitem{position:relative;display:flex;align-items:center;gap:9px;padding:9px 10px;font-size:13px;
  color:var(--ink-2);border-left:2px solid transparent;cursor:pointer;}
.hitem:hover{background:var(--surface-2);}
.hitem.active{background:var(--sky-bg);color:var(--navy);border-left-color:var(--sky);font-weight:600;}
.hitem .ht{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.hitem .del{opacity:0;flex-shrink:0;width:22px;height:22px;display:grid;place-items:center;
  color:var(--tagn);border:1px solid transparent;background:transparent;font-size:14px;}
.hitem:hover .del{opacity:1;}
.hitem .del:hover{color:var(--red);border-color:var(--line);background:var(--surface);}
.hempty{padding:16px 10px;font-size:12px;color:var(--tagn);line-height:1.5;}

.side-user{border-top:1px solid var(--line);padding:12px 14px;display:flex;align-items:center;gap:10px;}
.side-user .ava{width:34px;height:34px;flex-shrink:0;background:var(--navy);color:#fff;display:grid;
  place-items:center;font-weight:800;font-size:13px;}
.side-user .ui{flex:1;min-width:0;}
.side-user .un{font-size:13px;font-weight:700;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.side-user .ur{font-family:var(--mono);font-size:10px;color:var(--muted);}
.side-user .gear{width:32px;height:32px;flex-shrink:0;border:1px solid var(--line);background:var(--surface);
  color:var(--muted);display:grid;place-items:center;}
.side-user .gear:hover{border-color:var(--sky);color:var(--sky-deep);}
.side-user .gear svg{width:16px;height:16px;}

/* ===================== MAIN ===================== */
.main{flex:1;display:flex;flex-direction:column;height:100vh;overflow:hidden;background:var(--cream);}
.topbar{height:54px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;
  padding:0 22px;border-bottom:1px solid var(--line);background:rgba(255,255,255,.7);}
.topbar .tt{font-weight:800;font-size:14px;}
.topbar .tt small{font-family:var(--mono);font-weight:400;font-size:11px;color:var(--muted);margin-left:8px;}
.modelsel{display:flex;align-items:center;gap:8px;border:1px solid var(--line);background:var(--surface);
  padding:6px 10px;font-family:var(--mono);font-size:12px;color:var(--ink-2);}
.modelsel select{border:none;background:transparent;font-family:var(--mono);font-size:12px;color:var(--sky-deep);
  font-weight:700;outline:none;cursor:pointer;}
.modelsel .dot{width:7px;height:7px;background:var(--green);}

.scroll{flex:1;overflow-y:auto;scroll-behavior:smooth;}
.col{max-width:var(--col);margin:0 auto;padding:30px 24px 40px;}

/* ----- empty / welcome ----- */
.welcome{max-width:var(--col);margin:8vh auto 0;padding:0 24px;}
.welcome .eb{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--sky-deep);margin-bottom:14px;}
.welcome h1{font-size:clamp(28px,3.6vw,42px);font-weight:800;letter-spacing:-.02em;line-height:1.05;}
.welcome p{font-size:15.5px;color:var(--muted);line-height:1.55;margin-top:14px;max-width:580px;}
.chips{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);margin-top:28px;}
.chip{background:var(--surface);padding:16px 18px;cursor:pointer;transition:background .15s;}
.chip:hover{background:var(--surface-2);}
.chip .k{font-family:var(--mono);font-size:10px;color:var(--sky);letter-spacing:.06em;margin-bottom:7px;}
.chip .q{font-size:14px;color:var(--navy);font-weight:500;line-height:1.4;}

/* ----- messages ----- */
.msg{margin-bottom:24px;animation:rise .4s cubic-bezier(.18,.88,.22,1) both;}
@keyframes rise{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:none;}}
.msg.user{display:flex;justify-content:flex-end;}
.msg.user .ubox{max-width:80%;display:flex;flex-direction:column;align-items:flex-end;}
.msg.user .bub{background:var(--sky);color:#fff;border:1px solid var(--sky-deep);
  padding:11px 15px;font-size:14.5px;line-height:1.5;white-space:pre-wrap;
  overflow-wrap:anywhere;word-break:break-word;}
.msg.bot{display:flex;gap:13px;align-items:flex-start;}
.msg.bot .av{flex-shrink:0;background:transparent;display:flex;align-items:center;padding-top:2px;}
.msg.bot .av img{height:34px;width:auto;display:block;}
.bot-body{flex:1;min-width:0;}
.bot-name{font-weight:800;font-size:12.5px;margin-bottom:7px;color:var(--navy);}
.bot-name .tag{font-family:var(--mono);font-size:10px;font-weight:400;color:var(--tagn);border:1px solid var(--line);padding:1px 6px;margin-left:8px;}

/* markdown content */
.prose{font-size:14.5px;line-height:1.66;color:var(--ink-2);}
.prose>*:first-child{margin-top:0;}
.prose>*:last-child{margin-bottom:0;}
.prose p{margin:0 0 12px;}
.prose h1,.prose h2,.prose h3{color:var(--navy);font-weight:800;line-height:1.25;margin:18px 0 10px;letter-spacing:-.01em;}
.prose h1{font-size:21px;}.prose h2{font-size:18px;}.prose h3{font-size:15.5px;}
.prose b,.prose strong{color:var(--navy);font-weight:700;}
.prose ul,.prose ol{margin:0 0 12px;padding-left:22px;}
.prose li{margin:5px 0;}
.prose code{font-family:var(--mono);font-size:12.5px;background:var(--surface);border:1px solid var(--line);padding:1px 5px;color:var(--sky-deep);}
.prose pre{background:var(--surface);border:1px solid var(--line);padding:14px;overflow-x:auto;margin:0 0 12px;}
.prose pre code{background:none;border:none;padding:0;color:var(--ink-2);}
.prose a{color:var(--sky-deep);text-decoration:none;border-bottom:1px solid var(--sky-soft);}
.prose a:hover{border-bottom-color:var(--sky-deep);}
.prose blockquote{border-left:3px solid var(--sky-soft);padding-left:14px;color:var(--muted);margin:0 0 12px;}
.prose table{border-collapse:collapse;width:100%;margin:0 0 12px;font-size:13px;}
.prose th,.prose td{border:1px solid var(--line);padding:7px 10px;text-align:left;}
.prose th{background:var(--surface-2);font-family:var(--mono);font-size:11px;text-transform:uppercase;color:var(--tagn);}

/* sources */
.sources{margin-top:14px;border:1px solid var(--line);background:var(--surface);}
.sources>summary{list-style:none;cursor:pointer;padding:10px 14px;display:flex;align-items:center;gap:9px;font-size:12px;font-weight:700;color:var(--ink-2);}
.sources>summary::-webkit-details-marker{display:none;}
.sources>summary .cnt{font-family:var(--mono);font-size:11px;color:var(--sky-deep);border:1px solid var(--sky-soft);padding:1px 6px;}
.sources>summary .arr{margin-left:auto;color:var(--muted);font-size:10px;}
.src{display:block;padding:11px 14px;border-top:1px solid var(--line);text-decoration:none;color:inherit;}
.src:hover{background:var(--surface-2);}
.src .r1{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.src .id{font-family:var(--mono);font-size:12px;color:var(--sky-deep);font-weight:700;}
.src .tl{font-size:13px;color:var(--navy);}
.src .r2{display:flex;align-items:center;gap:8px;margin-top:5px;font-family:var(--mono);font-size:10px;color:var(--tagn);flex-wrap:wrap;}
.badge{font-family:var(--mono);font-size:9px;font-weight:700;padding:1px 6px;letter-spacing:.03em;text-transform:uppercase;border:1px solid currentColor;}
.badge.open{color:var(--green);}.badge.closed{color:var(--red);}.badge.wiki{color:var(--sky-deep);}

/* typing indicator */
.typing{display:flex;gap:5px;padding:4px 0;}
.typing i{width:7px;height:7px;background:var(--sky-soft);display:inline-block;animation:blink 1.2s infinite both;}
.typing i:nth-child(2){animation-delay:.2s;}.typing i:nth-child(3){animation-delay:.4s;}
@keyframes blink{0%,80%,100%{opacity:.25;}40%{opacity:1;}}

/* ===================== COMPOSER ===================== */
.composer{flex-shrink:0;padding:14px 24px 18px;background:linear-gradient(to top,var(--cream) 70%,transparent);}
.cwrap{max-width:var(--col);margin:0 auto;}
.inputbar{display:flex;align-items:flex-end;gap:8px;border:1px solid var(--line-2);background:var(--surface);
  padding:8px 8px 8px 8px;transition:border-color .15s,box-shadow .15s;box-shadow:0 2px 16px rgba(17,23,34,.06);}
.inputbar.focus{border-color:var(--sky);box-shadow:0 0 0 3px rgba(71,155,191,.13);}
.iconbtn{width:38px;height:38px;flex-shrink:0;border:1px solid var(--line);background:var(--surface);
  color:var(--muted);display:grid;place-items:center;}
.iconbtn:hover{border-color:var(--sky);color:var(--sky-deep);background:var(--sky-bg);}
.iconbtn svg{width:18px;height:18px;}
.inputbar textarea{flex:1;border:none;outline:none;resize:none;background:transparent;font-family:var(--font);
  font-size:14.5px;color:var(--navy);line-height:1.5;max-height:180px;padding:9px 4px;}
.inputbar textarea::placeholder{color:#9AA6B8;}
.send{width:38px;height:38px;flex-shrink:0;border:1px solid var(--sky);background:var(--sky);color:#fff;
  display:grid;place-items:center;transition:background .15s;}
.send:hover{background:var(--sky-deep);border-color:var(--sky-deep);}
.send:disabled{background:var(--surface-3);border-color:var(--line);color:var(--tagn);cursor:default;}
.send svg{width:18px;height:18px;}
.attached{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:0 auto 8px;max-width:var(--col);}
.attached:empty{display:none;}
.chipf{display:inline-flex;align-items:center;gap:7px;font-family:var(--mono);font-size:11px;color:var(--ink-2);
  border:1px solid var(--line);background:var(--surface);padding:5px 9px;max-width:240px;}
.chipf .nm{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.chipf .x{cursor:pointer;color:var(--tagn);flex-shrink:0;}.chipf .x:hover{color:var(--red);}
/* attachments shown under a user message */
.msg.user .atts{display:flex;flex-wrap:wrap;gap:5px;justify-content:flex-end;margin-top:6px;}
.msg.user .att{font-family:var(--mono);font-size:10px;color:var(--muted);border:1px solid var(--line);background:var(--surface);padding:3px 8px;}
.hint{text-align:center;font-family:var(--mono);font-size:10px;color:var(--tagn);margin-top:9px;}

/* ===================== SETTINGS MODAL ===================== */
.overlay{position:fixed;inset:0;background:rgba(17,23,34,.42);display:none;align-items:flex-start;justify-content:center;z-index:60;padding:8vh 20px;}
.overlay.open{display:flex;}
.modal{width:100%;max-width:460px;background:var(--surface);border:1px solid var(--line-2);box-shadow:0 18px 60px rgba(17,23,34,.22);animation:rise .25s cubic-bezier(.16,1,.3,1) both;}
.mhead{display:flex;align-items:center;justify-content:space-between;padding:18px 22px;border-bottom:1px solid var(--line);}
.mhead .h{font-weight:800;font-size:16px;}
.mclose{width:30px;height:30px;border:1px solid var(--line);background:var(--surface);color:var(--muted);font-size:15px;}
.mclose:hover{border-color:var(--sky);color:var(--sky-deep);}
.mbody{padding:20px 22px 24px;display:flex;flex-direction:column;gap:20px;}
.fld{display:flex;flex-direction:column;gap:8px;}
.fld label{font-family:var(--mono);font-size:10px;letter-spacing:.07em;text-transform:uppercase;color:var(--tagn);font-weight:700;}
.fld select{border:1px solid var(--line);background:var(--surface);padding:9px 11px;font-family:var(--font);font-size:13px;color:var(--navy);outline:none;}
.fld select:focus{border-color:var(--sky);}
.row{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--ink-2);cursor:pointer;}
.row input{accent-color:var(--sky);width:16px;height:16px;}
.rng{display:flex;flex-direction:column;gap:6px;}
.rng .lab{display:flex;justify-content:space-between;font-size:12px;color:var(--ink-2);}
.rng .lab b{font-family:var(--mono);color:var(--sky-deep);}
.rng input[type=range]{accent-color:var(--sky);}

@media(max-width:820px){
  body{flex-direction:column;overflow:auto;}
  .sidebar{width:100%;height:auto;flex-direction:row;align-items:center;border-right:none;border-bottom:1px solid var(--line);flex-wrap:wrap;}
  .history,.new-chat{display:none;}
  .main{height:auto;}.scroll{overflow:visible;}
  .chips{grid-template-columns:1fr;}
}