:root{
  --brand:#2dd4bf; --brand-deep:#14b8a6; --seen:#38bdf8;
  --bs-body-font-family:"Manrope",system-ui,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,monospace;
}
[data-bs-theme="dark"]{ --bs-body-bg:#0e1116; --panel:#151a21; --panel-2:#1b212b; --hair:#232b36; }
[data-bs-theme="light"]{ --bs-body-bg:#f4f6f8; --panel:#fff; --panel-2:#f0f3f6; --hair:#e3e8ee; }
body{ font-family:var(--bs-body-font-family); }
.text-brand{ color:var(--brand)!important; }
.btn-brand{ --bs-btn-bg:var(--brand-deep); --bs-btn-border-color:var(--brand-deep);
  --bs-btn-hover-bg:var(--brand); --bs-btn-hover-border-color:var(--brand);
  --bs-btn-color:#04201c; --bs-btn-hover-color:#04201c; --bs-btn-active-bg:var(--brand); font-weight:600; }
.panel{ background:var(--panel); border:1px solid var(--hair); border-radius:14px; }
.hair{ border-color:var(--hair)!important; }
.mono{ font-family:var(--mono); }
.fp{ font-family:var(--mono); font-size:.72rem; letter-spacing:.02em; word-break:break-all; }
.authwrap{ min-height:100dvh; display:grid; place-items:center; }
.auth-card{ width:100%; max-width:440px; }
.keyfile-drop{ border:1.5px dashed var(--hair); border-radius:12px; transition:.15s; }
.keyfile-drop.drag{ border-color:var(--brand); background:color-mix(in srgb,var(--brand) 8%,transparent); }
.screen{ display:none; } .screen.show{ display:block; }
.spinner-inline{ width:1rem; height:1rem; border-width:.15em; }

/* ---- интерфейс приложения (темы/лента/участники) ---- */
.app-shell{ height:calc(100dvh - 0px); }
.app-navbar{ background:var(--panel); border-bottom:1px solid var(--hair); }
.sidebar{ width:248px; background:var(--panel); border-right:1px solid var(--hair); }
.nav-rail .nav-link{ color:var(--bs-secondary-color); border-radius:10px; font-weight:600; }
.nav-rail .nav-link.active{ background:color-mix(in srgb,var(--brand) 16%,transparent); color:var(--brand); }
.nav-rail .nav-link:hover:not(.active){ background:var(--panel-2); }
.listcol{ width:320px; border-right:1px solid var(--hair); background:var(--panel); }
.list-item{ border-bottom:1px solid var(--hair); cursor:pointer; }
.list-item:hover{ background:var(--panel-2); }
.list-item.active{ background:color-mix(in srgb,var(--brand) 12%,transparent); }
.feed{ background:var(--bs-body-bg); }
.msg{ max-width:min(560px,84%); }
.bubble{ padding:.5rem .75rem; border-radius:14px; background:var(--panel); border:1px solid var(--hair); white-space:pre-wrap; word-wrap:break-word; }
.msg.out .bubble{ background:color-mix(in srgb,var(--brand) 20%,var(--panel)); border-color:transparent; }
.msg.out{ margin-left:auto; align-items:flex-end; }
.meta{ font-size:.72rem; color:var(--bs-secondary-color); }
.composer{ background:var(--panel); border-top:1px solid var(--hair); }
.badge-soft{ background:var(--panel-2); color:var(--bs-secondary-color); border:1px solid var(--hair); font-weight:600; }
@media (max-width:991.98px){
  .sidebar{ display:none!important; }
  .listcol{ width:100%; }
  .md-detail{ display:none; }
  .md-show-detail .listcol{ display:none; }
  .md-show-detail .md-detail{ display:flex; }
}
.tick-seen{ color:var(--seen); }