/* ─── Fonts ─────────────────────────────────────────────────────────────────── */
@font-face { font-family: 'IBM Plex Sans'; font-style: normal; font-weight: 300; font-display: swap; src: url('/web/fonts/ibm-plex-sans-300.woff2') format('woff2'); }
@font-face { font-family: 'IBM Plex Sans'; font-style: normal; font-weight: 400; font-display: swap; src: url('/web/fonts/ibm-plex-sans-400.woff2') format('woff2'); }
@font-face { font-family: 'IBM Plex Sans'; font-style: normal; font-weight: 500; font-display: swap; src: url('/web/fonts/ibm-plex-sans-500.woff2') format('woff2'); }
@font-face { font-family: 'IBM Plex Sans'; font-style: normal; font-weight: 600; font-display: swap; src: url('/web/fonts/ibm-plex-sans-600.woff2') format('woff2'); }
@font-face { font-family: 'IBM Plex Mono'; font-style: normal; font-weight: 400; font-display: swap; src: url('/web/fonts/ibm-plex-mono-400.woff2') format('woff2'); }
@font-face { font-family: 'IBM Plex Mono'; font-style: normal; font-weight: 500; font-display: swap; src: url('/web/fonts/ibm-plex-mono-500.woff2') format('woff2'); }
@font-face { font-family: 'IBM Plex Mono'; font-style: normal; font-weight: 600; font-display: swap; src: url('/web/fonts/ibm-plex-mono-600.woff2') format('woff2'); }

/* ─── Reset ─────────────────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

/* ─── Design Tokens ─────────────────────────────────────────────────────────── */
:root {
  --bg: #0a0a0f; --surface: #111118; --surface2: #16161f; --border: #1e1e2e;
  --border2: #2a2a3e; --accent: #7c6af7; --accent-dim: rgba(124,106,247,0.15);
  --text: #e0dff5; --text2: #a0a0bf; --muted: #6e6d8a;
  --green: #50fa7b; --red: #ff5555; --yellow: #f1fa8c; --cyan: #8be9fd;
  --sidebar-w: 260px; --radius: 4px;
}

/* ─── Base ───────────────────────────────────────────────────────────────────── */
body { background:var(--bg); color:var(--text); font-family:'IBM Plex Sans',sans-serif; }
::-webkit-scrollbar { width:6px; height:6px; }
::-webkit-scrollbar-track { background:transparent; }
::-webkit-scrollbar-thumb { background:var(--border2); }
::-webkit-scrollbar-thumb:hover { background:var(--muted); }
.hidden { display:none !important; }
.text-muted { color:var(--muted) !important; }
.text-accent { color:var(--accent) !important; }
.text-red { color:var(--red) !important; }
.text-green { color:var(--green) !important; }
.flex-1 { flex:1; }
.flex-row-sm { display:flex; gap:.5rem; }
.version-label { font-family:'IBM Plex Mono',monospace; font-size:.6rem; color:var(--muted); }

/* ─── Common Components ──────────────────────────────────────────────────────── */
.logo { font-family:'IBM Plex Mono',monospace; font-size:.8rem; color:var(--accent); letter-spacing:.15em; text-transform:uppercase; }
.lang-btn { font-size:.65rem; color:var(--muted); cursor:pointer; font-family:'IBM Plex Mono',monospace; padding:.2rem .4rem; border:1px solid var(--border); background:none; margin-right:.25rem; }
.lang-btn:hover, .lang-btn.active { color:var(--accent); border-color:var(--accent); }
.badge { display:inline-block; padding:.15rem .5rem; font-family:'IBM Plex Mono',monospace; font-size:.65rem; border:1px solid; }
.badge-green { color:var(--green); border-color:rgba(80,250,123,.3); background:rgba(80,250,123,.08); }
.badge-red { color:var(--red); border-color:rgba(255,85,85,.3); background:rgba(255,85,85,.08); }
.badge-accent { color:var(--accent); border-color:rgba(124,106,247,.3); background:rgba(124,106,247,.08); }
.badge-cyan { color:var(--cyan); border-color:rgba(139,233,253,.3); background:rgba(139,233,253,.08); }
.badge-muted { color:var(--muted); border-color:var(--border); }
.badge-yellow { color:#f1c40f; border-color:rgba(241,196,15,.3); background:rgba(241,196,15,.08); }
.badge-orange { color:#e67e22; border-color:rgba(230,126,34,.3); background:rgba(230,126,34,.08); }
/* Backend Groups accordion */
.bg-model-row { cursor:pointer; }
.bg-model-row td.bg-expand-cell::before { content:'▾'; display:inline-block; margin-right:.3rem; font-size:.75rem; transition:transform .2s; transform:rotate(-90deg); }
.bg-model-row.open td.bg-expand-cell::before { transform:rotate(0deg); }
.bg-backends-row td { background:var(--bg); padding:0 !important; }
/* Topbar base (common across pages) */
.topbar { background:var(--surface); border-bottom:1px solid var(--border); display:flex; align-items:center; justify-content:space-between; }
/* Lightbox (canonical — used by both app.html and shared.html) */
.lightbox-overlay { position:fixed; inset:0; background:rgba(0,0,0,.85); display:flex; align-items:center; justify-content:center; z-index:9999; cursor:pointer; opacity:0; pointer-events:none; transition:opacity .2s; }
.lightbox-overlay.active { opacity:1; pointer-events:auto; }
.lightbox-overlay img { max-width:90vw; max-height:90vh; object-fit:contain; border-radius:4px; box-shadow:0 0 40px rgba(0,0,0,.5); cursor:default; }
.lightbox-close { position:fixed; top:1rem; right:1rem; z-index:10000; background:rgba(255,255,255,.15); border:none; color:#fff; width:36px; height:36px; border-radius:50%; cursor:pointer; font-size:1.1rem; display:flex; align-items:center; justify-content:center; }
.lightbox-close:hover { background:rgba(255,255,255,.3); }
.lightbox-prev, .lightbox-next { position:fixed; top:50%; transform:translateY(-50%); z-index:10000; background:rgba(255,255,255,.15); border:none; color:#fff; width:44px; height:44px; border-radius:50%; cursor:pointer; font-size:1.4rem; display:flex; align-items:center; justify-content:center; }
.lightbox-prev { left:1rem; }
.lightbox-next { right:1rem; }
.lightbox-prev:hover, .lightbox-next:hover { background:rgba(255,255,255,.3); }
.lightbox-counter { position:absolute; bottom:1rem; left:50%; transform:translateX(-50%); color:rgba(255,255,255,.7); font-size:.8rem; font-family:'IBM Plex Mono',monospace; }

/* ─── Application Styles ─────────────────────────────────────────────────────── */
body.app-page { height:100vh; display:flex; flex-direction:column; overflow:hidden; visibility:hidden; }
#appWrapper { display:flex; flex:1; min-height:0; overflow:hidden; }
body.app-page.authenticated { visibility:visible; }
body.app-page.public-docs { visibility:visible; }
body.app-page.public-docs .sidebar { display:none; }
body.app-page.public-docs .main { width:100vw; }
.sidebar { width:var(--sidebar-w); background:var(--surface); border-right:1px solid var(--border); display:flex; flex-direction:column; flex-shrink:0; }
.sidebar-logo { min-height:56px; padding:0 1.5rem; border-bottom:1px solid var(--border); display:flex; align-items:center; gap:.75rem; }
.logo-icon { width:28px;height:28px; background:var(--accent); display:flex;align-items:center;justify-content:center; font-family:'IBM Plex Mono',monospace; font-size:.7rem; font-weight:600; color:white; flex-shrink:0; }
.logo-text { font-family:'IBM Plex Mono',monospace; font-size:.8rem; font-weight:600; letter-spacing:.05em; }
.sidebar-nav { flex:1; overflow-y:auto; padding:1rem 0; }
.nav-section-label { font-family:'IBM Plex Mono',monospace; font-size:.6rem; letter-spacing:.15em; text-transform:uppercase; color:var(--muted); padding:.75rem 1.5rem .4rem; }
.nav-item { display:flex; align-items:center; gap:.75rem; padding:.6rem 1.5rem; cursor:pointer; font-size:.875rem; color:var(--text2); transition:all .15s; border-left:2px solid transparent; text-decoration:none; }
.nav-item:hover { background:var(--accent-dim); color:var(--text); }
.nav-item.active { color:var(--accent); border-left-color:var(--accent); background:var(--accent-dim); }
.nav-item svg { flex-shrink:0; opacity:.7; }
.nav-item.active svg { opacity:1; }
.chat-list { padding:0 .75rem; }
.project-group { margin-bottom:.5rem; border:1px solid transparent; transition:border-color .15s,background .15s; }
.project-header { display:flex; align-items:center; gap:.5rem; padding:.3rem .75rem; cursor:pointer; font-size:.75rem; color:var(--text2); border-radius:2px; }
.project-header:hover { background:var(--border); }
.project-dot { width:8px;height:8px;border-radius:50%;flex-shrink:0; }
.project-name { flex:1; font-weight:500; }
.project-actions { opacity:0; display:flex;gap:.25rem; }
@media (hover: hover) { .project-header:hover .project-actions { opacity:1; } }
.project-action-btn { background:none;border:none;cursor:pointer;color:var(--muted);font-size:.7rem;padding:.1rem .25rem; }
.project-action-btn:hover { color:var(--text); }
.project-chats { padding-left:.5rem; }
.chat-item { display:flex; align-items:center; justify-content:space-between; padding:.35rem .75rem; cursor:pointer; border-radius:2px; font-size:.8rem; color:var(--text2); transition:background .15s; gap:.5rem; touch-action:manipulation; }
.chat-item:hover { background:var(--border); color:var(--text); }
.chat-item.active { background:var(--accent-dim); color:var(--accent); }
.chat-item-title { flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.chat-item-icons { display:flex;gap:.2rem;align-items:center;flex-shrink:0; }
.chat-item-share-icon { font-size:.65rem; color:var(--cyan); opacity:.8; }
.chat-item-delete { opacity:0; font-size:.75rem; color:var(--muted); padding:.1rem .3rem; transition:opacity .15s; }
@media (hover: hover) { .chat-item:hover .chat-item-delete { opacity:1; } }
.new-chat-btn { margin:.5rem .75rem; padding:.5rem .75rem; background:var(--accent-dim); border:1px dashed rgba(124,106,247,.3); color:var(--accent); font-family:'IBM Plex Mono',monospace; font-size:.75rem; cursor:pointer; width:calc(100% - 1.5rem); text-align:left; transition:background .15s; }
.new-chat-btn:hover { background:rgba(124,106,247,.25); }
.sidebar-user { padding:1rem 1.5rem; border-top:1px solid var(--border); display:flex; align-items:center; gap:.75rem; min-width:0; }
.user-avatar { width:28px;height:28px; background:var(--accent-dim); border:1px solid rgba(124,106,247,.4); border-radius:50%; display:flex;align-items:center;justify-content:center; font-family:'IBM Plex Mono',monospace; font-size:.7rem; color:var(--accent); flex-shrink:0; cursor:pointer; }
.user-avatar:hover { border-color:var(--accent); }
.user-info { flex:1; min-width:0; cursor:pointer; }
.user-info:hover .user-name { color:var(--accent); }
.user-name { font-size:.8rem; font-weight:500; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.user-role { font-size:.65rem; color:var(--muted); font-family:'IBM Plex Mono',monospace; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.logout-btn { font-size:.7rem; color:var(--muted); cursor:pointer; }
.logout-btn:hover { color:var(--red); }
.main { flex:1; display:flex; flex-direction:column; min-height:0; overflow:hidden; }
body.app-page .topbar { padding:0 2rem; min-height:56px; flex-shrink:0; }
.page-title { font-size:.875rem; font-weight:500; }
.page-subtitle { font-size:.75rem; color:var(--muted); font-family:'IBM Plex Mono',monospace; }
.content { flex:1; overflow-y:auto; padding:2rem; min-height:0; }
.card { background:var(--surface); border:1px solid var(--border); padding:1.5rem; margin-bottom:1.5rem; overflow-x:auto; -webkit-overflow-scrolling:touch; }
.card:has(.filter-bar) { overflow:visible; }
.card-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:1.25rem; }
.card-title { font-size:.875rem; font-weight:600; font-family:'IBM Plex Mono',monospace; letter-spacing:.05em; }
.stats-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:1rem; margin-bottom:1.5rem; }
.stat-card { background:var(--surface); border:1px solid var(--border); padding:1.25rem 1.5rem; }
.stat-label { font-family:'IBM Plex Mono',monospace; font-size:.65rem; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); margin-bottom:.5rem; }
.stat-value { font-family:'IBM Plex Mono',monospace; font-size:1.75rem; font-weight:600; }
.stat-value.accent { color:var(--accent); }
.stat-value.green { color:var(--green); }
table { width:100%; border-collapse:collapse; font-size:.85rem; }
th { text-align:left; padding:.6rem 1rem; font-family:'IBM Plex Mono',monospace; font-size:.65rem; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); border-bottom:1px solid var(--border); }
td { padding:.75rem 1rem; border-bottom:1px solid var(--border); color:var(--text2); vertical-align:middle; }
tr:last-child td { border-bottom:none; }
tr:hover td { background:rgba(255,255,255,.02); }
.mono { font-family:'IBM Plex Mono',monospace; font-size:.8rem; }
kbd { display:inline-block; background:var(--bg); border:1px solid var(--border); border-radius:3px; padding:.1rem .35rem; font-family:'IBM Plex Mono',monospace; font-size:.7rem; box-shadow:0 1px 0 var(--border); color:var(--text2); line-height:1.2; }
.nav-badge { display:inline-flex; align-items:center; justify-content:center; min-width:18px; height:18px; padding:0 .35rem; background:var(--accent); color:#fff; font-family:'IBM Plex Mono',monospace; font-size:.6rem; border-radius:9px; margin-left:auto; }
.info-icon { display:inline-flex; align-items:center; justify-content:center; width:1rem; height:1rem; border-radius:50%; background:var(--accent); color:var(--bg); font-size:.6rem; font-weight:700; font-style:normal; font-family:'IBM Plex Mono',monospace; cursor:help; vertical-align:middle; margin-left:.25rem; flex-shrink:0; }
.bug-unread-row { border-left:2px solid var(--accent) !important; }
.comment-bubble { padding:.75rem; margin-bottom:.75rem; border:1px solid var(--border); font-size:.85rem; white-space:pre-wrap; }
.comment-bubble.admin-comment { background:rgba(124,106,247,.05); border-color:rgba(124,106,247,.2); }
.comment-bubble.user-comment { background:var(--bg); }
.comment-meta { font-size:.7rem; color:var(--muted); margin-bottom:.35rem; }
.bug-img-preview { display:inline-block; max-width:80px; max-height:60px; border:1px solid var(--border); border-radius:3px; margin:.25rem .25rem 0 0; cursor:pointer; }
.bug-img-full { max-width:100%; border:1px solid var(--border); border-radius:3px; margin:.25rem 0; }
details summary { list-style:none; }
details summary::-webkit-details-marker { display:none; }
details summary::before { content:'▶'; display:inline-block; margin-right:.4rem; font-size:.55rem; transition:transform .15s; vertical-align:middle; }
details[open] summary::before { transform:rotate(90deg); }
.form-group { margin-bottom:1.25rem; }
.form-label { display:block; font-family:'IBM Plex Mono',monospace; font-size:.65rem; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); margin-bottom:.5rem; }
.form-input, .form-select { width:100%; background:var(--bg); border:1px solid var(--border); color:var(--text); padding:.65rem .875rem; font-family:'IBM Plex Sans',sans-serif; font-size:.875rem; outline:none; transition:border-color .2s; appearance:none; height:2rem; box-sizing:border-box; }
.form-select, select.form-input { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' fill='none'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%236e6d8a' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right .875rem center; padding-right:2.25rem; cursor:pointer; }
select.form-select, select.form-input { padding-top:0; padding-bottom:0; line-height:calc(2rem - 2px); }
textarea.form-input { height:auto; min-height:2rem; vertical-align:top; resize:vertical; }
.form-input:focus, .form-select:focus { border-color:var(--accent); }
.btn { display:inline-flex; align-items:center; gap:.4rem; padding:.6rem 1.25rem; border:none; cursor:pointer; font-family:'IBM Plex Mono',monospace; font-size:.75rem; letter-spacing:.08em; text-transform:uppercase; transition:all .15s; }
.btn-primary { background:var(--accent); color:white; }
.btn-primary:hover { background:#9d8fff; }
.btn-ghost { background:transparent; color:var(--text2); border:1px solid var(--border); }
.btn-ghost:hover { border-color:var(--accent); color:var(--accent); }
.btn-danger { background:transparent; color:var(--red); border:1px solid rgba(255,85,85,.3); }
.btn-danger:hover { background:rgba(255,85,85,.1); }
.btn-sm { padding:.35rem .75rem; font-size:.65rem; }
.btn-sm.btn-action { font-size:1rem; padding:0; width:2rem; height:2rem; justify-content:center; }
.btn-disabled-slot { opacity:.15; cursor:default; }
.btn:disabled, .btn-ghost:disabled, .btn-danger:disabled, .btn-primary:disabled { opacity:.4; cursor:default; pointer-events:none; }
.model-selector:disabled { opacity:.4; cursor:default; pointer-events:none; }
.file-upload-btn:disabled { opacity:.4; cursor:default; pointer-events:none; }
.voice-record-btn:disabled { opacity:.4; cursor:default; pointer-events:none; }
.th-sortable { cursor: pointer; user-select: none; white-space: nowrap; }
.tbl-loading { opacity:.25; pointer-events:none; }
.tbl-spinner-bar { display:flex; align-items:center; gap:.5rem; padding:.4rem .75rem; background:var(--surface); border-bottom:1px solid var(--border); color:var(--muted); font-size:.78rem; font-family:var(--mono); }
@keyframes skel-shimmer { 0%{background-position:200% 0} 100%{background-position:-200% 0} }
.skel-cell { padding:.5rem .75rem; }
.skel-bar { height:.7rem; border-radius:3px; display:inline-block; background:linear-gradient(90deg,var(--surface2) 25%,var(--border) 50%,var(--surface2) 75%); background-size:200% 100%; animation:skel-shimmer 1.4s ease-in-out infinite; }
.th-sortable .sort-icon { opacity: .3; margin-left: .3rem; font-size: .7rem; }
.th-sortable.sort-active { color: var(--accent); }
.th-sortable.sort-active .sort-icon { opacity: 1; }
@keyframes lgw-idx-pulse { 0%,100%{opacity:1} 50%{opacity:.35} }
.idx-btn-pulsing { animation:lgw-idx-pulse 1.2s ease-in-out infinite; }
.pagination { display:flex; align-items:center; gap:.75rem; padding:.75rem 1rem; border-top:1px solid var(--border); font-family:'IBM Plex Mono',monospace; font-size:.75rem; color:var(--text2); }
.pagination button { background:none; border:1px solid var(--border); color:var(--text2); padding:.3rem .6rem; cursor:pointer; font-family:'IBM Plex Mono',monospace; font-size:.7rem; }
.pagination button:hover:not(:disabled) { border-color:var(--accent); color:var(--accent); }
.pagination button:disabled { opacity:.3; cursor:default; }
.pagination .page-info { flex:1; text-align:center; }
.pg-size-sd .sd-wrapper { width:auto; }
.pg-size-sd .sd-trigger { background:var(--bg); border:1px solid var(--border); color:var(--text); font-family:'IBM Plex Mono',monospace; font-size:.7rem; padding:.25rem .5rem; height:auto; min-width:3rem; }
.pg-size-sd .sd-panel { font-family:'IBM Plex Mono',monospace; font-size:.7rem; min-width:max-content; }
.pagination .filter-info { font-size:.7rem; color:var(--muted); }
.sd-wrapper { position:relative; display:inline-block; width:100%; }
.sd-trigger { display:flex; align-items:center; justify-content:space-between; gap:.5rem; background:var(--bg); border:1px solid var(--border); color:var(--text); padding:.65rem .875rem; font-size:.875rem; cursor:pointer; min-width:0; transition:border-color .2s; height:2rem; box-sizing:border-box; }
.sd-trigger:hover, .sd-trigger.open { border-color:var(--accent); }
.sd-trigger-text { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; flex:1; }
.sd-trigger-clear { font-size:.7rem; color:var(--muted); padding:.1rem .3rem; cursor:pointer; }
.sd-trigger-clear:hover { color:var(--red); }
.sd-trigger-arrow { font-size:.6rem; color:var(--muted); }
.sd-disabled .sd-trigger { opacity:.4; cursor:default; pointer-events:none; }
.sd-dropdown { position:absolute; top:100%; bottom:auto; left:0; right:0; background:var(--surface); border:1px solid var(--border2); z-index:1000; display:none; flex-direction:column; }
.sd-flip .sd-dropdown { top:auto; bottom:100%; border-top:1px solid var(--border2); border-bottom:none; }
.sd-dropdown.open { display:flex; }
.sd-search { padding:.5rem; border-bottom:1px solid var(--border); }
.sd-search input { width:100%; background:var(--bg); border:1px solid var(--border); color:var(--text); padding:.4rem .6rem; font-size:.8rem; outline:none; box-sizing:border-box; }
.sd-search input:focus { border-color:var(--accent); }
.sd-options { overflow-y:auto; max-height:240px; }
.sd-option { padding:.5rem .75rem; font-size:.85rem; color:var(--text2); cursor:pointer; }
.sd-option:hover { background:rgba(124,106,247,.1); color:var(--text); }
.sd-kb-focus { background:rgba(124,106,247,.18); color:var(--text); }

.sd-no-results { padding:.5rem .75rem; font-size:.8rem; color:var(--muted); font-style:italic; }
.sd-result-count { padding:.3rem .75rem; font-size:.65rem; color:var(--muted); border-top:1px solid var(--border); }
.filter-bar { display:flex; gap:1rem; flex-wrap:wrap; align-items:flex-end; }
.filter-group { display:flex; flex-direction:column; gap:.4rem; position:relative; }
.filter-group:has(.sd-dropdown.open) { z-index:10; }
.filter-group .filter-label { font-family:'IBM Plex Mono',monospace; font-size:.65rem; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%; }
.modal-backdrop { position:fixed;inset:0; background:rgba(0,0,0,.7); display:none; align-items:center; justify-content:center; z-index:100; }
.modal-backdrop.show { display:flex; }
.modal-wrapper { position:relative; width:100%; max-width:480px; }
.modal-wrapper.modal-wide { max-width:800px; }
.modal { background:var(--surface); border:1px solid var(--border2); padding:0; width:100%; position:relative; max-height:85vh; overflow:hidden; display:flex; flex-direction:column; }
.modal-title { font-family:'IBM Plex Mono',monospace; font-size:.9rem; font-weight:600; flex-shrink:0; padding:2rem 2.5rem 1.5rem 2rem; border-bottom:1px solid var(--border); background:var(--surface); position:relative; z-index:10001; }
.modal-body { flex:1; overflow-y:auto; min-height:0; padding:1.5rem 2rem; }
.modal-actions { display:flex; gap:.75rem; justify-content:flex-end; flex-shrink:0; padding:1rem 2rem 1.5rem; border-top:1px solid var(--border); background:var(--surface); position:relative; z-index:10001; }
.modal::before { content:''; position:absolute; top:0;left:0;right:0; height:1px; background:linear-gradient(90deg,transparent,var(--accent),transparent); }
.modal-close-btn { position:absolute;top:.75rem;right:.75rem;z-index:10002;background:none;border:none;color:var(--muted);cursor:pointer;font-size:1rem;line-height:1;padding:.25rem .4rem;font-family:'IBM Plex Mono',monospace; }
.modal-close-btn:hover { color:var(--text); }
.tbl-badge { display:inline-flex;align-items:center;justify-content:center;min-width:1.2rem;height:1.2rem;padding:0 .3rem;font-family:'IBM Plex Mono',monospace;font-size:.65rem;font-weight:600;background:rgba(124,106,247,.15);color:var(--accent);border:1px solid rgba(124,106,247,.3);border-radius:.2rem;vertical-align:middle; }
.btn-badge-wrap { position:relative; display:inline-flex; align-items:center; justify-content:center; }
.btn-badge-wrap .tbl-badge { position:absolute; top:-5px; right:-5px; pointer-events:none; min-width:1rem; height:1rem; font-size:.55rem; padding:0 .2rem; }
.key-display { background:var(--bg); border:1px solid rgba(124,106,247,.4); padding:.875rem; font-family:'IBM Plex Mono',monospace; font-size:.8rem; color:var(--accent); word-break:break-all; margin:1rem 0; }
.key-warning { font-size:.75rem; color:var(--yellow); padding:.5rem; background:rgba(241,250,140,.08); border:1px solid rgba(241,250,140,.2); }
/* Chat */
.chat-container { display:flex; flex-direction:column; height:100%; }
.chat-header { padding:1rem 1.5rem; border-bottom:1px solid var(--border); display:flex; align-items:center; gap:.35rem; flex-shrink:0; background:var(--surface); }
.chat-title-input { background:transparent; border:none; border-bottom:1px solid transparent; color:var(--text); font-family:'IBM Plex Sans',sans-serif; font-size:.9rem; font-weight:500; padding:.2rem .3rem; outline:none; flex:1; min-width:0; }
.chat-title-input:hover { border-bottom-color:var(--border); }
.chat-title-input:focus { border-bottom-color:var(--accent); }
.share-badge { display:inline-flex;align-items:center;gap:.3rem; font-family:'IBM Plex Mono',monospace; font-size:.65rem; color:var(--cyan); border:1px solid rgba(139,233,253,.3); padding:.15rem .5rem; white-space:nowrap; }
.model-selector { background:var(--surface2); border:1px solid var(--border); color:var(--text2); font-family:'IBM Plex Mono',monospace; font-size:.72rem; padding:.35rem 1.75rem .35rem .65rem; outline:none; cursor:pointer; appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' fill='none'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%236e6d8a' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right .5rem center; }
.model-selector:focus { border-color:var(--accent); }
.chat-header-sd { flex:none; }
.chat-header-sd .sd-wrapper { width:auto; }
.chat-header-sd .sd-trigger { background:var(--surface2); border:1px solid var(--border); color:var(--text2); font-family:'IBM Plex Mono',monospace; font-size:.72rem; padding:.35rem .6rem; height:auto; white-space:nowrap; }
.chat-header-sd .sd-panel { font-family:'IBM Plex Mono',monospace; font-size:.72rem; min-width:max-content; }
#chatModelSelect.chat-header-sd .sd-wrapper { min-width:9rem; }
#chatModelSelect.chat-header-sd .sd-trigger { max-width:18rem; }
.chat-temp-control { display:flex; align-items:center; gap:.3rem; flex-shrink:0; }
.temp-slider { width:5.5rem; cursor:pointer; accent-color:var(--accent); }
.temp-slider.temp-unset { opacity:.35; }
.temp-slider:disabled { cursor:default; }
.temp-icon { font-size:.82rem; line-height:1; }
.temp-val { font-size:.72rem; color:var(--muted); min-width:1.9rem; text-align:center; }
.messages { flex:1; overflow-y:auto; padding:1.5rem; display:flex; flex-direction:column; gap:1.25rem; }
.message { display:flex; gap:.875rem; animation:msgIn .2s ease; }
@keyframes msgIn { from{opacity:0;transform:translateY(8px)} to{opacity:1;transform:none} }
.message-avatar { width:28px;height:28px; border-radius:0; display:flex;align-items:center;justify-content:center; font-family:'IBM Plex Mono',monospace; font-size:.65rem; font-weight:600; flex-shrink:0; margin-top:2px; }
.message.user .message-avatar { background:rgba(124,106,247,.2);color:var(--accent);border:1px solid rgba(124,106,247,.3); }
.message.assistant .message-avatar { background:rgba(80,250,123,.1);color:var(--green);border:1px solid rgba(80,250,123,.2); }
.message.summary .message-avatar { background:rgba(241,196,15,.15);color:var(--yellow);border:1px solid rgba(241,196,15,.3); }
.message.summary .message-content { border:1px solid rgba(241,196,15,.25);background:rgba(241,196,15,.05);padding:.75rem 1rem;cursor:pointer; }
.summary-label { font-family:'IBM Plex Mono',monospace;font-size:.65rem;color:var(--yellow);text-transform:uppercase;letter-spacing:.03em;margin-bottom:.25rem; }
.summary-content { white-space:pre-wrap; }
.summary-content.collapsed { max-height:3.5em;overflow:hidden;position:relative; }
.summary-content.collapsed::after { content:'';position:absolute;bottom:0;left:0;right:0;height:2em;background:linear-gradient(transparent,var(--bg)); }
.excluded-group { padding:.4rem .75rem;cursor:pointer;font-family:'IBM Plex Mono',monospace;font-size:.7rem;color:var(--muted);border:1px dashed var(--border);margin:.25rem 0;transition:all .15s; }
.excluded-group:hover { border-color:var(--accent);color:var(--accent); }
.excluded-messages { display:none; }
.excluded-messages.show .message { opacity:.45; }
.excluded-messages.show { display:block; }
.message-body { flex:1; min-width:0; }
.message-meta { font-family:'IBM Plex Mono',monospace; font-size:.65rem; color:var(--muted); margin-bottom:.35rem; }
.message-content { font-size:.875rem; line-height:1.7; color:var(--text); }
.message.user .message-content { background:rgba(124,106,247,.08); border:1px solid rgba(124,106,247,.15); padding:.75rem 1rem; white-space:pre-wrap; border-radius:.75rem; }
.message.assistant .message-content { background:var(--surface); border:1px solid var(--border); border-radius:.75rem; padding:.75rem 1rem; }
.message.assistant .message-content:empty { display:none; }
.message-actions { margin-top:.25rem; opacity:0; transition:opacity .15s; display:flex; align-items:center; gap:.35rem; flex-wrap:wrap; }
.message:hover .message-actions { opacity:1; }
.message-actions .btn { font-size:.7rem; color:var(--muted); padding:.15rem .5rem; }
.message-actions .btn:hover { color:var(--accent); }
.abort-badge { font-family:'IBM Plex Mono',monospace; font-size:.65rem; color:var(--muted); margin-top:.35rem; }
.abort-badge::before { content:'⚠ '; }
.messages.conversation-mode { display:flex; flex-direction:column; }
.messages.conversation-mode .message { max-width:100%; }
.messages.conversation-mode .message.user.in-conversation { flex-direction:row-reverse; align-self:flex-end; max-width:80%; }
.messages.conversation-mode .message.user.in-conversation .message-body { align-items:flex-end; }
.messages.conversation-mode .message.user.in-conversation .message-content { background:rgba(124,106,247,.18); border-color:rgba(124,106,247,.3); }
.messages.conversation-mode .message.assistant { align-self:flex-start; max-width:80%; }
.conv-mode-btn.active { color:var(--accent); }
.header-badge { position:absolute; top:-4px; right:-4px; background:var(--accent); color:#fff; border-radius:50%; font-size:.55rem; min-width:14px; height:14px; line-height:14px; text-align:center; font-family:'IBM Plex Mono',monospace; pointer-events:none; z-index:1; }
/* Markdown */
.message-content h1,.message-content h2,.message-content h3 { color:var(--text); margin:.75rem 0 .4rem; font-weight:600; }
.message-content h1 { font-size:1.1rem; }
.message-content h2 { font-size:1rem; }
.message-content h3 { font-size:.9rem; }
.message-content p { margin-bottom:.6rem; }
.message-content p:last-child { margin-bottom:0; }
.message-content ul,.message-content ol { padding-left:1.5rem; margin-bottom:.6rem; }
.message-content li { margin-bottom:.2rem; }
.message-content li > p { margin-bottom:.1rem; }
.message-content code { background:rgba(124,106,247,.15); color:var(--cyan); padding:.1rem .35rem; font-family:'IBM Plex Mono',monospace; font-size:.82rem; border-radius:2px; white-space:nowrap; }
.message-content pre { background:#0d0d15; border:1px solid var(--border); padding:1rem; overflow-x:auto; margin:.5rem 0 .75rem; border-radius:2px; }
.message-content pre code { background:none; padding:0; color:var(--text2); font-size:.82rem; white-space:pre; border-radius:0; }
.message-content blockquote { border-left:3px solid var(--accent); padding:.25rem 0 .25rem 1rem; color:var(--text2); margin:.5rem 0 .6rem; }
.message-content table { margin-bottom:.6rem; border-collapse:collapse; width:100%; }
.message-content th,.message-content td { border:1px solid var(--border); padding:.4rem .75rem; font-size:.82rem; }
.message-content th { background:rgba(124,106,247,.1); }
.message-content a { color:var(--accent); text-decoration:none; }
.message-content a:hover { text-decoration:underline; }
.message-content hr { border:none; border-top:1px solid var(--border); margin:.75rem 0; }
.message-content strong { color:var(--text); font-weight:600; }
.message-content em { color:var(--text2); }
.reasoning-block { border-left:3px solid var(--accent); margin:.5rem 0 .75rem; }
.reasoning-block summary { cursor:pointer; font-size:.75rem; font-family:'IBM Plex Mono',monospace; color:var(--muted); padding:.35rem .75rem; user-select:none; }
.reasoning-block summary:hover { color:var(--text2); }
.reasoning-block .reasoning-content { padding:.5rem 1rem; font-size:.8rem; line-height:1.6; color:var(--text2); }
.think-block { border-left:3px solid var(--accent); margin:.5rem 0 .75rem; }
.think-block .think-header { cursor:pointer; display:flex; align-items:center; gap:6px; font-size:.75rem; font-family:'IBM Plex Mono',monospace; color:var(--muted); padding:.35rem .75rem; user-select:none; }
.think-block .think-header:hover { color:var(--text2); }
.think-block .think-content { display:none; padding:.5rem 1rem; font-size:.8rem; line-height:1.6; color:var(--text2); }
.think-block.open .think-content { display:block; }
.tool-block { border-left:3px solid var(--green,#50fa7b); margin:.5rem 0 .75rem; }
.tool-block .tool-header { cursor:pointer; display:flex; align-items:center; gap:6px; font-size:.75rem; font-family:'IBM Plex Mono',monospace; color:var(--muted); padding:.35rem .75rem; user-select:none; }
.tool-block .tool-header:hover { color:var(--text2); }
.tool-block .tool-content { display:none; padding:.25rem .75rem .5rem; }
.tool-block.open .tool-content { display:block; }
.tool-call-item { margin:.25rem 0; font-size:.75rem; }
.tool-call-item .tool-call-name { font-family:'IBM Plex Mono',monospace; font-weight:600; color:var(--text); }
.tool-call-item .tool-call-meta { color:var(--muted); font-size:.7rem; font-family:'IBM Plex Mono',monospace; white-space:pre-wrap; margin:.15rem 0 0 .5rem; }
.think-block .think-header::before, .tool-block .tool-header::before { content:'▾'; margin-right:.3rem; font-size:.75rem; opacity:1; display:inline-block; transition:transform .2s; transform:rotate(-90deg); }
.think-block.open .think-header::before, .tool-block.open .tool-header::before { transform:rotate(0deg); }
.think-block .think-content pre { white-space:pre-wrap; word-break:break-all; overflow-x:auto; max-height:200px; margin:.25rem 0; }
.corpus-block { border-left:3px solid var(--accent); margin:.5rem 0 .75rem; }
.corpus-block .corpus-header { display:flex; align-items:center; gap:6px; font-size:.75rem; font-family:'IBM Plex Mono',monospace; color:var(--muted); padding:.35rem .75rem; }
.corpus-block .corpus-progress { padding:.15rem .75rem .35rem; font-size:.7rem; font-family:'IBM Plex Mono',monospace; color:var(--muted); }
.corpus-block .corpus-progress .corpus-bar { height:3px; background:var(--border); border-radius:2px; margin-top:.3rem; overflow:hidden; }
.corpus-block .corpus-progress .corpus-bar-fill { height:100%; background:var(--accent); border-radius:2px; transition:width .3s ease; }
.chat-input-area { padding:1rem 1.5rem; border-top:1px solid var(--border); background:var(--surface); flex-shrink:0; }
.chat-input-row { display:flex; gap:.75rem; align-items:flex-end; }
.chat-input-hint { text-align:center; padding:.2rem .5rem 0; font-size:.7rem; }
.chat-input-hint a { color:var(--muted); text-decoration:none; }
.chat-input-hint a:hover { color:var(--accent); }
.chat-textarea { flex:1; background:var(--bg); border:1px solid var(--border); color:var(--text); padding:.75rem 1rem; font-family:'IBM Plex Sans',sans-serif; font-size:.875rem; outline:none; resize:none; min-height:44px; max-height:200px; line-height:1.5; transition:border-color .2s; }
.chat-textarea:focus { border-color:var(--accent); }
.send-btn { padding:.7rem 1rem; background:var(--accent); border:none; color:white; cursor:pointer; font-family:'IBM Plex Mono',monospace; font-size:.8rem; transition:background .15s; height:44px; display:flex;align-items:center; }
.send-btn:hover { background:#9d8fff; }
.send-btn:disabled { background:var(--muted); cursor:not-allowed; }
.send-btn.stop-mode { background:var(--red,#ff5555); font-size:1rem; }
.send-btn.stop-mode:hover { background:#ff3333; }
.streaming-indicator { display:flex;align-items:center;gap:6px;padding:.25rem 0;margin-top:.25rem; }
.streaming-dot { width:8px;height:8px;background:var(--accent);border-radius:50%;animation:streamPulse 1.5s ease-in-out infinite; }
@keyframes streamPulse { 0%,100%{opacity:.3;transform:scale(.8)} 50%{opacity:1;transform:scale(1)} }
.empty-state { display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;color:var(--muted);gap:1rem;text-align:center; }
.empty-icon { font-size:3rem; opacity:.3; }
.empty-title { font-size:1rem; color:var(--text2); }
.toast-container { position:fixed;bottom:1.5rem;right:1.5rem;z-index:200;display:flex;flex-direction:column;gap:.5rem; }
.toast { padding:.75rem 1.25rem; background:var(--surface2); border:1px solid var(--border2); font-family:'IBM Plex Mono',monospace; font-size:.78rem; color:var(--text); animation:toastIn .2s ease; min-width:280px; }
.toast.success { border-left:3px solid var(--green); }
.toast.error { border-left:3px solid var(--red); }
.toast.info { border-left:3px solid var(--cyan); }
.toast.warning { border-left:3px solid var(--yellow); }
@keyframes toastIn { from{opacity:0;transform:translateX(20px)} to{opacity:1;transform:none} }
.color-picker-row { display:flex; gap:.5rem; flex-wrap:wrap; margin-top:.5rem; }
.color-swatch { width:24px;height:24px;border-radius:50%;cursor:pointer;border:2px solid transparent;transition:border-color .15s; }
.color-swatch.selected, .color-swatch:hover { border-color:white; }
.no-project-zone { border:1px solid transparent; transition:border-color .15s,background .15s; border-radius:2px; }
.project-group.drag-over, .no-project-zone.drag-over { border-color:var(--accent); background:rgba(124,106,247,.08); }
.project-card .project-table-header.drag-over { background:rgba(124,106,247,.12) !important; border-left-color:var(--accent) !important; outline:1px dashed var(--accent); }
.chat-item[draggable="true"] { cursor:grab; }
.chat-item[draggable="true"]:active { cursor:grabbing; opacity:.6; }
.drag-handle { cursor:grab; color:var(--muted); user-select:none; margin-right:.4rem; display:inline-block; }
.drag-handle:active { cursor:grabbing; }
.drop-hint { font-size:.7rem; color:var(--muted); font-family:'IBM Plex Mono',monospace; padding:.3rem .75rem; display:none; font-style:italic; }
.project-group.drag-over .drop-hint, .no-project-zone.drag-over .drop-hint { display:block; }
/* Sidebar collapse */
.sidebar-toggle { display:none; background:none; border:none; color:var(--muted); cursor:pointer; padding:.4rem; transition:color .15s; }
.sidebar-toggle:hover { color:var(--accent); }
.sidebar-toggle svg { display:block; transition:transform .2s ease; }
.sidebar.collapsed .desktop-toggle svg { transform:rotate(180deg); }
.sidebar.collapsed .nav-item span,
.sidebar.collapsed .nav-section-label,
.sidebar.collapsed .logo-text,
.sidebar.collapsed #versionDisplay,
.sidebar.collapsed #chatSidebar,
.sidebar.collapsed .user-info,
.sidebar.collapsed .lang-btn,
.sidebar.collapsed .logout-btn,
.sidebar.collapsed .org-switch-btn,
.sidebar.collapsed .logo-info { display:none; }
.sidebar.collapsed { width:52px; min-width:52px; }
.sidebar.collapsed .sidebar-logo { padding:.85rem .75rem; flex-direction:column; align-items:center; gap:.25rem; }
.sidebar.collapsed .desktop-toggle { position:static; }
.sidebar.collapsed .nav-item { padding:.6rem 0; justify-content:center; border-left:none; }
.sidebar.collapsed .nav-item.active { border-left:none; background:var(--accent-dim); }
.sidebar.collapsed .sidebar-user { padding:.75rem .5rem; justify-content:center; }
.sidebar.collapsed .sidebar-user .user-avatar { margin:0; }
@media (min-width:769px) {
  .sidebar-toggle.desktop-toggle { display:block; position:absolute; top:.85rem; right:.5rem; z-index:2; }
  .sidebar-logo { position:relative; padding-right:2rem; }
  .sidebar { transition:width .2s ease; }
  .main { transition:margin-left .2s ease; }
}
@media (max-width:768px) {
  body.app-page { flex-direction:column; }
  .sidebar { position:fixed; bottom:0; left:0; right:0; width:100%!important; height:auto; min-height:0;
    flex-direction:row; border-right:none; border-top:1px solid var(--border); z-index:50;
    padding:0; overflow:visible; }
  .sidebar-logo, .sidebar-user, #chatSidebar, .nav-section-label { display:none!important; }
  .sidebar-nav { display:flex; flex-direction:row; justify-content:space-around; align-items:center;
    padding:.35rem 0; overflow:visible; flex:1; }
  .sidebar-nav .nav-item { padding:.45rem .65rem; border-left:none; border-bottom:2px solid transparent;
    flex-direction:column; gap:.15rem; font-size:.6rem; }
  .sidebar-nav .nav-item.active { border-left:none; border-bottom-color:var(--accent); }
  .sidebar-nav .nav-item span { font-size:.55rem; display:block; }
  .sidebar-nav .nav-item svg { width:18px; height:18px; }
  .main { height:100vh; width:100vw; }
  .topbar { padding:0 1rem; height:48px; }
  .content { padding:1rem; padding-bottom:70px; }
  .card { padding:1rem; margin-bottom:1rem; overflow-x:auto; -webkit-overflow-scrolling:touch; }
  table { font-size:.75rem; min-width:400px; }
  th,td { padding:.4rem .5rem; }
  .chat-container { height:calc(100vh - 48px); max-width:100vw; }
  .chat-container[style] { margin:-1rem!important; }
  .chat-header { padding:.5rem .75rem; flex-wrap:wrap; gap:.5rem; }
  .messages { padding:1rem; padding-bottom:10px; }
  .message { max-width:100%; }
  .message-body { min-width:0; max-width:calc(100vw - 56px); }
  .message-content { word-break:break-word; overflow-wrap:break-word; }
  .message.user .message-content { word-break:break-word; }
  .message-content pre { overflow-x:auto; max-width:calc(100vw - 72px); }
  .chat-input-area { padding:.75rem 1rem; padding-bottom:calc(.75rem + 60px); }
  .chat-textarea { font-size:.8rem; min-height:40px; }
  .chat-input-row { gap:.5rem; }
  .stats-grid { grid-template-columns:repeat(2,1fr)!important; gap:.5rem!important; }
  .stat-card { padding:.75rem 1rem!important; }
  .stat-value { font-size:1.25rem!important; }
  .mobile-context-backdrop { position:fixed; inset:0; background:rgba(0,0,0,.6); z-index:60; display:none; }
  .mobile-context-backdrop.show { display:block; }
  .mobile-context-menu { position:fixed; top:0; left:0; bottom:0; width:280px; background:var(--surface);
    z-index:61; transform:translateX(-100%); transition:transform .25s ease; overflow-y:auto;
    border-right:1px solid var(--border); display:flex; flex-direction:column; }
  .mobile-context-backdrop.show .mobile-context-menu { transform:translateX(0); }
  .mobile-context-header { padding:1rem; border-bottom:1px solid var(--border); display:flex;
    align-items:center; gap:.75rem; flex-shrink:0; }
  .mobile-context-close { background:none; border:none; color:var(--muted); cursor:pointer; font-size:1.2rem; padding:.25rem; }
  .mobile-context-close:hover { color:var(--text); }
  .mobile-context-actions { padding:.5rem; display:flex; flex-direction:column; gap:.15rem; border-bottom:1px solid var(--border); }
  .mobile-context-item { display:flex; align-items:center; gap:.75rem; padding:.6rem .75rem; cursor:pointer;
    font-size:.85rem; color:var(--text2); transition:all .15s; border-radius:2px; touch-action:manipulation; }
  .mobile-context-item:hover { background:var(--accent-dim); color:var(--text); }
  .mobile-context-item svg { flex-shrink:0; opacity:.7; }
  .mobile-context-logout { color:var(--red); }
  .mobile-context-logout:hover { background:rgba(255,85,85,.1); }
  .mobile-context-lang { display:flex; gap:.5rem; padding:.5rem .75rem; }
  .mobile-context-lang .lang-btn { flex:1; text-align:center; padding:.4rem; }
  .mobile-context-section-label { font-family:'IBM Plex Mono',monospace; font-size:.6rem; letter-spacing:.15em;
    text-transform:uppercase; color:var(--muted); padding:.75rem .75rem .4rem; }
  .mobile-context-chats .new-chat-btn { margin:.5rem .5rem; width:calc(100% - 1rem); }
  .mobile-context-chats .chat-list { padding:0 .25rem; }
  .mobile-only-btn { display:inline-flex!important; }
  .desktop-only-btn { display:none!important; }
}
.desktop-only-btn { display:inline-flex; }
.mobile-context-backdrop { display:none; }
.org-switch-btn { cursor:pointer;color:var(--muted);padding:.2rem;transition:color .15s; }
.org-switch-btn:hover { color:var(--accent); }
.org-switch-list { display:flex;flex-direction:column;gap:.5rem; }
.org-switch-item { display:flex;align-items:center;justify-content:space-between;padding:.75rem 1rem;background:var(--bg);border:1px solid var(--border);cursor:pointer;transition:all .15s; }
.org-switch-item:hover { border-color:var(--accent);background:rgba(124,106,247,.08); }
.org-switch-item.active { border-color:var(--accent);background:var(--accent-dim); }
.org-switch-item-name { font-size:.875rem;font-weight:500; }
.org-switch-item-role { font-family:'IBM Plex Mono',monospace;font-size:.65rem;color:var(--muted); }
.file-upload-btn { background:none;border:1px solid var(--border);color:var(--muted);cursor:pointer;padding:.5rem .7rem;font-size:.85rem;display:flex;align-items:center;transition:all .15s;height:44px; }
.file-upload-btn:hover { border-color:var(--accent);color:var(--accent); }
.file-list { display:flex;gap:.4rem;flex-wrap:wrap;padding:.25rem 0; }
.file-chip { display:inline-flex;align-items:center;gap:.3rem;padding:.2rem .5rem;background:rgba(124,106,247,.1);border:1px solid rgba(124,106,247,.2);font-family:'IBM Plex Mono',monospace;font-size:.7rem;color:var(--accent); }
.file-chip-delete { cursor:pointer;color:var(--muted);font-size:.65rem; }
.file-chip-delete:hover { color:var(--red); }
.message-files { display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.5rem; }
.message-file-chip { display:inline-flex;align-items:center;gap:.3rem;padding:.25rem .6rem;background:rgba(124,106,247,.08);border:1px solid rgba(124,106,247,.2);border-radius:4px;font-family:'IBM Plex Mono',monospace;font-size:.7rem;color:var(--accent);text-decoration:none;transition:all .15s; }
.message-file-chip:hover { background:rgba(124,106,247,.15);border-color:var(--accent); }
.message-file-chip .file-size { color:var(--muted); }
.message-file-preview { display:block; }
.code-block-wrapper { position:relative;margin:.5rem 0; }
.code-toolbar { display:flex;justify-content:space-between;align-items:center;padding:.2rem .6rem;background:rgba(0,0,0,.3);border-radius:6px 6px 0 0;border:1px solid var(--border);border-bottom:none; }
.code-block-wrapper pre { margin:0;border-top-left-radius:0;border-top-right-radius:0;padding:.5rem .75rem; }
.code-lang-label { font-family:'IBM Plex Mono',monospace;font-size:.65rem;color:var(--muted);text-transform:uppercase;letter-spacing:.03em; }
.code-download-btn, .code-copy-btn { background:none;border:1px solid var(--border);color:var(--muted);font-size:.65rem;padding:.15rem .5rem;border-radius:3px;cursor:pointer;font-family:'IBM Plex Mono',monospace;transition:all .15s; }
.code-download-btn:hover, .code-copy-btn:hover { color:var(--accent);border-color:var(--accent); }
.code-toolbar-actions { display:flex;gap:.3rem; }
.chat-input-area.drag-over { border:2px dashed var(--accent);background:rgba(124,106,247,.06); }
.drag-overlay-hint { display:none;text-align:center;padding:.4rem;font-family:'IBM Plex Mono',monospace;font-size:.75rem;color:var(--accent); }
.chat-input-area.drag-over .drag-overlay-hint { display:block; }
.file-upload-zone.dragover { border-color:var(--accent) !important;background:rgba(124,106,247,.08); }
.voice-record-btn.recording { background:rgba(255,85,85,.15);border-color:rgba(255,85,85,.4);color:var(--red);animation:pulse-record 1.5s infinite; }
.voice-timer { font-family:'IBM Plex Mono',monospace;font-size:.7rem;color:var(--red);padding:0 .3rem;display:flex;align-items:center; }
@keyframes pulse-record { 0%,100%{opacity:1} 50%{opacity:.5} }
.quota-bar { height:4px;background:var(--border);margin-top:.25rem;border-radius:2px;overflow:hidden; }
.quota-bar-fill { height:100%;background:var(--accent);border-radius:2px;transition:width .3s; }
.quota-bar-fill.warn { background:var(--yellow); }
.quota-bar-fill.danger { background:var(--red); }
.quota-info { font-family:'IBM Plex Mono',monospace;font-size:.65rem;color:var(--muted);margin-top:.15rem; }
.storage-bar-wrap { margin-bottom:1rem; }
.storage-bar-header { display:flex;align-items:baseline;gap:.5rem;margin-bottom:.5rem; }
.storage-bar-title { font-family:'IBM Plex Mono',monospace;font-size:.75rem;color:var(--text2); }
.storage-bar-used { font-family:'IBM Plex Mono',monospace;font-size:.7rem; }
.storage-bar-used.warn { color:var(--yellow); }
.storage-bar-used.danger { color:var(--red); }
.storage-bar-track { display:flex;height:18px;border-radius:4px;overflow:hidden;width:100%;border:1px solid var(--border); }
.storage-bar-seg { height:100%;transition:width .3s;cursor:default; }
.storage-bar-legend { display:flex;gap:1rem;flex-wrap:wrap;margin-top:.4rem; }
.storage-bar-leg-item { display:flex;align-items:center;gap:.3rem;font-family:'IBM Plex Mono',monospace;font-size:.65rem;color:var(--text2); }
.storage-bar-leg-dot { width:8px;height:8px;border-radius:2px;flex-shrink:0; }
.chat-input-area.quota-exceeded .chat-textarea { border-color:var(--red);background:rgba(255,85,85,.05);pointer-events:none;opacity:.5; }
.chat-input-area.quota-exceeded .send-btn { background:var(--muted);pointer-events:none; }
.chat-input-area.quota-exceeded .file-upload-btn { pointer-events:none;opacity:.5; }
.quota-exceeded-banner { background:rgba(255,85,85,.1);border:1px solid rgba(255,85,85,.3);color:var(--red);font-family:'IBM Plex Mono',monospace;font-size:.78rem;padding:.5rem .75rem;margin-bottom:.5rem; }
.impersonation-banner { background:var(--red); color:#fff; padding:.35rem 1rem; font-size:.8rem; font-family:'IBM Plex Mono',monospace; display:flex; align-items:center; justify-content:center; position:sticky; top:0; z-index:100; }
.impersonation-banner button { margin-left:.75rem; background:rgba(255,255,255,.2); color:#fff; border:1px solid rgba(255,255,255,.4); font-size:.75rem; padding:.2rem .6rem; border-radius:var(--radius); cursor:pointer; }
.impersonation-banner button:hover { background:rgba(255,255,255,.3); }
/* highlight.js overrides */
.hljs { background:#0d0d15 !important; padding:0 !important; }
.message-content pre code.hljs { font-size:.82rem; line-height:1.5; }
/* Chat breadcrumb */
.chat-breadcrumb { display:flex; align-items:center; gap:.4rem; padding:.5rem 0 1rem; font-size:.85rem; flex-wrap:wrap; }
.breadcrumb-sep { color:var(--muted); margin:0 .2rem; user-select:none; }
.breadcrumb-item { position:relative; display:inline-flex; align-items:center; gap:.2rem; }
.breadcrumb-item a { color:var(--accent); text-decoration:none; }
.breadcrumb-item a:hover { text-decoration:underline; }
.breadcrumb-item.current { color:var(--text); font-weight:600; }
.breadcrumb-dd-arrow { font-size:.55rem; cursor:pointer; color:var(--muted); margin-left:.15rem; padding:2px 4px; border-radius:3px; }
.breadcrumb-dd-arrow:hover { background:var(--surface2); color:var(--text); }
.breadcrumb-dropdown { position:absolute; top:calc(100% + 4px); left:0; background:var(--surface2); border:1px solid var(--border); border-radius:6px; z-index:200; min-width:220px; max-height:300px; display:flex; flex-direction:column; box-shadow:0 4px 16px rgba(0,0,0,.4); }
.breadcrumb-dropdown .bc-dd-search { padding:.5rem; border-bottom:1px solid var(--border); }
.breadcrumb-dropdown .bc-dd-search input { width:100%; background:var(--surface); border:1px solid var(--border); border-radius:4px; padding:.3rem .5rem; color:var(--text); font-size:.8rem; }
.breadcrumb-dropdown .bc-dd-list { overflow-y:auto; max-height:250px; }
.breadcrumb-dropdown .bc-dd-item { padding:.4rem .75rem; cursor:pointer; font-size:.8rem; display:flex; align-items:center; gap:.4rem; }
.breadcrumb-dropdown .bc-dd-item:hover { background:var(--accent-dim); }
.breadcrumb-dropdown .bc-dd-item.active { color:var(--accent); font-weight:600; }
.breadcrumb-dropdown .bc-dd-empty { padding:.5rem .75rem; font-size:.8rem; color:var(--muted); }
/* Project DataTable Cards */
.project-card { border:1px solid var(--border); border-radius:8px; overflow:hidden; }
.project-card.archived { opacity:.65; }
.project-table-header { display:flex; align-items:center; padding:.6rem 1rem; gap:.5rem; cursor:pointer; transition:background .15s; user-select:none; }
.project-table-header:hover { filter:brightness(1.15); }
.project-table-header .project-dot { width:10px; height:10px; border-radius:50%; flex-shrink:0; }
.project-table-header .project-name { font-weight:600; flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.project-table-header .project-meta { font-size:.75rem; color:var(--muted); white-space:nowrap; }
.project-table-header .project-actions { display:flex; gap:.25rem; opacity:1; }
.collapse-arrow { display:inline-block; font-size:.6rem; color:var(--muted); transition:transform .2s; }
.collapse-arrow.collapsed { transform:rotate(-90deg); }
.project-table-body { border-top:1px solid var(--border); }
.project-filter-bar { padding:.5rem 1rem; display:flex; gap:.5rem; align-items:center; }
.project-filter-bar input { max-width:300px; font-size:.8rem; }
.project-filter-bar label { display:flex; align-items:center; gap:.3rem; font-size:.7rem; color:var(--muted); cursor:pointer; white-space:nowrap; }
.clickable-row { cursor:pointer; }
.clickable-row:hover td { background:var(--surface2); }

/* ─── Shared Chat ────────────────────────────────────────────────────────────── */
body.shared-page { min-height:100vh; }
body.shared-page .topbar { padding:1rem 2rem; }
.share-notice { font-family:'IBM Plex Mono',monospace; font-size:.7rem; color:var(--muted); display:flex; align-items:center; gap:.5rem; }
.share-notice span { color:var(--cyan); }
.shared-container { max-width:860px; margin:0 auto; padding:2rem; }
.shared-chat-title { font-size:1.25rem; font-weight:500; margin-bottom:.25rem; }
.shared-chat-meta { font-family:'IBM Plex Mono',monospace; font-size:.7rem; color:var(--muted); margin-bottom:2rem; }
.shared-error { text-align:center; padding:4rem; color:var(--muted); }
.shared-error-icon { font-size:1.5rem; margin-bottom:.5rem; }
/* Shared chat file attachments */
.msg-files { display:flex; flex-wrap:wrap; gap:.5rem; margin-top:.5rem; }
.msg-file { background:rgba(124,106,247,.08); border:1px solid rgba(124,106,247,.15); border-radius:4px; overflow:hidden; }
.msg-file img { max-width:320px; max-height:240px; display:block; cursor:pointer; transition:opacity .15s; }
.msg-file img:hover { opacity:.85; }
.msg-file audio { display:block; margin:.5rem; }
.msg-file-download { display:flex; align-items:center; gap:.5rem; padding:.5rem .75rem; color:var(--accent); text-decoration:none; font-family:'IBM Plex Mono',monospace; font-size:.75rem; }
.msg-file-download:hover { background:rgba(124,106,247,.15); }
.msg-file-download .file-icon { font-size:1rem; }
.msg-file-download .file-size { color:var(--muted); }
/* Shared chat loading/error states */
.shared-loading { color:var(--muted); font-family:'IBM Plex Mono',monospace; font-size:.8rem; }

/* ─── Auth Pages ─────────────────────────────────────────────────────────────── */
body.auth-page { min-height:100vh; display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden; }
body.auth-page::before { content:''; position:fixed; top:-50%;left:-50%;width:200%;height:200%; background:radial-gradient(ellipse at 30% 20%,rgba(124,106,247,.08) 0%,transparent 50%),radial-gradient(ellipse at 70% 80%,rgba(80,250,123,.04) 0%,transparent 50%); pointer-events:none; }
.grid-bg { position:fixed;inset:0; background-image:linear-gradient(rgba(124,106,247,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(124,106,247,.04) 1px,transparent 1px); background-size:40px 40px; pointer-events:none; }
.login-card { background:var(--surface); border:1px solid var(--border); padding:3rem; width:100%; max-width:420px; position:relative; z-index:1; display:none; }
.login-card.visible { display:block; }
.login-section-hidden { display:none; }
.login-card::before { content:''; position:absolute; top:0;left:0;right:0; height:2px; background:linear-gradient(90deg,transparent,var(--accent),transparent); }
.auth-card { background:var(--surface); border:1px solid var(--border); padding:3rem; width:100%; max-width:420px; position:relative; z-index:1; }
.auth-card::before { content:''; position:absolute; top:0;left:0;right:0; height:2px; background:linear-gradient(90deg,transparent,var(--accent),transparent); }
.card-top { display:flex; align-items:center; justify-content:space-between; margin-bottom:.25rem; }
.lang-row { display:flex; gap:.25rem; }
.auth-page h1 { font-size:1.75rem; font-weight:300; color:var(--text); margin-bottom:.25rem; margin-top:.5rem; }
.subtitle { font-size:.85rem; color:var(--muted); margin-bottom:2.5rem; }
.auth-page label { display:block; font-family:'IBM Plex Mono',monospace; font-size:.7rem; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); margin-bottom:.5rem; margin-top:1.25rem; }
.auth-page input { width:100%; background:var(--bg); border:1px solid var(--border); color:var(--text); padding:.75rem 1rem; font-family:'IBM Plex Mono',monospace; font-size:.9rem; outline:none; transition:border-color .2s; }
.auth-page input:focus { border-color:var(--accent); }
.auth-btn { display:block; width:100%; margin-top:2rem; padding:.875rem; background:var(--accent); border:none; color:white; font-family:'IBM Plex Mono',monospace; font-size:.85rem; letter-spacing:.1em; text-transform:uppercase; cursor:pointer; transition:background .2s; }
.auth-btn:hover { background:#9d8fff; }
.auth-btn:disabled { opacity:.5; cursor:not-allowed; }
.status-msg { margin-top:1rem; padding:.75rem; font-family:'IBM Plex Mono',monospace; font-size:.8rem; display:none; }
.status-msg.show { display:block; }
.status-msg.error { background:rgba(255,85,85,.1); border:1px solid rgba(255,85,85,.3); color:var(--red); }
.status-msg.success { background:rgba(80,250,123,.1); border:1px solid rgba(80,250,123,.3); color:var(--green); }
.org-sel-title { font-size:1.1rem; font-weight:400; margin-bottom:1.25rem; color:var(--text); }
.org-btn { display:flex; align-items:center; justify-content:space-between; width:100%; padding:.875rem 1rem; margin-bottom:.75rem; background:var(--bg); border:1px solid var(--border); color:var(--text); cursor:pointer; font-family:'IBM Plex Sans',sans-serif; font-size:.9rem; transition:all .2s; }
.org-btn:hover { border-color:var(--accent); background:rgba(124,106,247,.08); }
.org-btn-name { font-weight:500; }
.forgot-link { display:block; text-align:center; margin-top:1rem; font-family:'IBM Plex Mono',monospace; font-size:.75rem; color:var(--muted); text-decoration:none; cursor:pointer; }
.forgot-link:hover { color:var(--accent); }
.login-footer { margin-top:2rem; text-align:center; font-family:'IBM Plex Mono',monospace; font-size:.7rem; color:var(--muted); }
.login-footer a { color:var(--accent); text-decoration:none; }
.login-footer a:hover { text-decoration:underline; }
/* Reset password specific */
.msg { margin-top:1rem; padding:.75rem; font-family:'IBM Plex Mono',monospace; font-size:.8rem; display:none; }
.msg.show { display:block; }
.msg.error { background:rgba(255,85,85,.1); border:1px solid rgba(255,85,85,.3); color:var(--red); }
.msg.success { background:rgba(80,250,123,.1); border:1px solid rgba(80,250,123,.3); color:var(--green); }
.hint { font-size:.75rem; color:var(--muted); margin-top:.5rem; }
.back-link { display:block; text-align:center; margin-top:1.5rem; font-family:'IBM Plex Mono',monospace; font-size:.75rem; color:var(--muted); text-decoration:none; }
.back-link:hover { color:var(--accent); }
/* Password visibility toggle button */
.pw-toggle-btn { background:none; border:1px solid var(--border); color:var(--muted); padding:.5rem .75rem; cursor:pointer; font-size:1rem; border-radius:0; }
/* Input row (password + toggle) */
.input-row { display:flex; gap:.5rem; }
.input-row input { flex:1; }

/* DataTable controls auto-refresh select — height matches btn-sm btn-action buttons */
.dt-autorefresh-sd .sd-wrapper { width:auto; }
.dt-autorefresh-sd .sd-trigger { font-size:.8rem; padding:.35rem .6rem; height:auto; min-width:6rem; }

/* ─── Topbar Logo (shared/other pages) ──────────────────────────────────────── */
.topbar-logo { display:flex; align-items:center; gap:.75rem; text-decoration:none; color:inherit; }
.topbar-logo:hover .logo-text { color:var(--accent); }
/* Shared chat footer */
.shared-footer { text-align:center; padding:2rem; font-family:'IBM Plex Mono',monospace; font-size:.7rem; color:var(--muted); }
.shared-footer a { color:var(--accent); text-decoration:none; }
.shared-footer a:hover { text-decoration:underline; }

/* ─── Utility Classes ────────────────────────────────────────────────────────── */
/* Layout */
.action-cell { vertical-align:middle; white-space:nowrap; }
.action-cell > * + * { margin-left:.35rem; }
.dt-controls { display:flex; gap:.5rem; align-items:center; justify-content:flex-end; }
.text-center { text-align:center; }
.text-right { text-align:right; }
.td-truncate { max-width:300px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ml-auto { margin-left:auto; }
.flex-end { display:flex; align-items:flex-end; }
.flex-center { display:flex; align-items:center; gap:.5rem; }
.w-auto { width:auto; }
.w-full { width:100%; }
.overflow-auto { overflow:auto; }
.resize-v { resize:vertical; }
/* Typography */
.mono-sm { font-family:'IBM Plex Mono',monospace; font-size:.75rem; }
.text-xs { font-size:.65rem; }
.text-sm { font-size:.75rem; }
.text-base { font-size:.85rem; }
.field-meta { font-weight:normal; color:var(--text2); font-size:.75rem; }
.label-muted { font-size:.7rem; color:var(--muted); }
.text-yellow { color:var(--yellow); }
.text-cyan { color:var(--cyan); }
.text-error { color:var(--error,var(--red)); }
.font-bold { font-weight:bold; }
.font-normal { font-weight:normal; }
/* Spacing */
.mt-xs { margin-top:.25rem; }
.mb-xs { margin-bottom:.25rem; }
.mt-sm { margin-top:.5rem; }
.mb-sm { margin-bottom:.5rem; }
.mt-md { margin-top:1rem; }
.mb-md { margin-bottom:1rem; }
.mt-lg { margin-top:1.5rem; }
.mb-lg { margin-bottom:1.5rem; }
.p-sm { padding:.5rem; }
.p-md { padding:1rem; }
.p-lg { padding:2rem; }
.p-xl { padding:4rem; }
.px-sm { padding-left:.5rem; padding-right:.5rem; }
.px-md { padding-left:1rem; padding-right:1rem; }
.py-sm { padding-top:.5rem; padding-bottom:.5rem; }
.py-md { padding-top:1rem; padding-bottom:1rem; }
.empty-state-pad { padding:4rem; }
/* Width utilities */
.w-120 { width:120px; }
.w-130 { width:130px; }
.w-140 { width:140px; }
.w-160 { width:160px; }
.w-170 { width:170px; }
.w-180 { width:180px; }
.w-200 { width:200px; }
.w-220 { width:220px; }
.w-250 { width:250px; }
.w-280 { width:280px; }
/* White-space */
.ws-nowrap { white-space:nowrap; }
.ml-xs { margin-left:.25rem; }
.ml-sm { margin-left:.5rem; }
.py-md-v { padding-top:1rem; padding-bottom:0; }
.flex-center-lg { display:flex; align-items:center; gap:.75rem; }
.m-0 { margin:0; }
.mb-0 { margin-bottom:0; }
.mb-3q { margin-bottom:.75rem; }
.cursor-pointer { cursor:pointer; }
tr.row-selected td { background:color-mix(in srgb,var(--accent) 10%,transparent); }
tr.cursor-pointer:hover td { background:var(--surface2); }
.text-text2 { color:var(--text2); }
.text-transform-none { text-transform:none; }
.pos-relative { position:relative; }
.flex-wrap { flex-wrap:wrap; }
.flex-nowrap { flex-wrap:nowrap; }
.flex-between { display:flex; justify-content:space-between; align-items:center; }

/* ─── Additional Utility Classes ─────────────────────────────────────────── */
/* Badges */
.badge-tool-internal { background:rgba(80,250,251,.1); color:#50fafb; border-color:rgba(80,250,251,.2); }
.badge-tool-external { background:rgba(255,215,0,.1); color:#ffd700; border-color:rgba(255,215,0,.2); }
.badge-tmp { background:rgba(241,250,140,.15); color:var(--yellow); border-color:rgba(241,250,140,.3); }
.badge-pdf { background:rgba(255,100,100,.15); color:#ff6464; border-color:rgba(255,100,100,.3); }
.badge-archived { background:var(--muted); color:var(--bg); font-size:.65rem; padding:1px 6px; border-radius:3px; border:none; }
.badge-archived-sm { background:var(--muted); color:var(--bg); font-size:.6rem; padding:1px 4px; border-radius:3px; border:none; }
.badge-counter { position:absolute; top:-2px; right:-4px; font-size:.55rem; background:var(--red); color:#fff; border-radius:50%; min-width:14px; height:14px; display:flex; align-items:center; justify-content:center; padding:0 2px; }
.badge-counter-accent { position:absolute; top:-2px; right:-4px; font-size:.55rem; background:var(--accent); color:#fff; border-radius:50%; min-width:14px; height:14px; display:flex; align-items:center; justify-content:center; padding:0 2px; }
/* Display */
.d-flex { display:flex; }
/* Typography */
.text-xl { font-size:1.25rem; }
.text-2xl { font-size:2rem; }
.text-lg { font-size:1.5rem; }
/* Opacity */
.opacity-70 { opacity:.7; }
/* Grid layouts */
.grid-2col { display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; }
.grid-3col { display:grid; grid-template-columns:repeat(3,1fr); gap:.5rem .8rem; }
.grid-4col { display:grid; grid-template-columns:repeat(4,1fr); gap:.5rem .8rem; }
.grid-kv { display:grid; grid-template-columns:auto 1fr; gap:.5rem .75rem; font-size:.85rem; }
.grid-kv-sm { display:grid; grid-template-columns:auto 1fr; gap:.3rem .75rem; font-size:.85rem; }
/* Message error state */
.message-avatar-error { background:rgba(255,85,85,.2); color:var(--red); border-color:rgba(255,85,85,.3); }
.message-content-error { border-color:rgba(255,85,85,.2); background:rgba(255,85,85,.05); }
.message-content-llerror { color:var(--red); border-left:3px solid var(--red); padding-left:.75rem; background:color-mix(in srgb,var(--red) 8%,var(--bg2)); border-radius:0 4px 4px 0; }
/* Error messages from LLM use a distinct avatar style */
.message.assistant:has(.message-content-llerror) .message-avatar { background:rgba(255,85,85,.2); color:var(--red); border-color:rgba(255,85,85,.3); }
/* Log pre block */
.log-pre { background:var(--surface2); padding:.75rem; border-radius:6px; font-size:.75rem; overflow-x:auto; white-space:pre-wrap; word-break:break-all; height:160px; max-height:600px; overflow-y:auto; resize:vertical; }
/* Flex with large gap */
.flex-lg-gap { display:flex; gap:1.5rem; flex-wrap:wrap; }
.flex-md-gap { display:flex; gap:1rem; flex-wrap:wrap; }
/* Drop zone */
.drop-zone { border:2px dashed var(--border); border-radius:8px; padding:2rem; text-align:center; cursor:pointer; transition:border-color .15s,background .15s; }
/* Spinner */
@keyframes lgw-spin { to { transform:rotate(360deg); } }
.modal-spinner { width:2.5rem; height:2.5rem; border:3px solid var(--border); border-top-color:var(--accent); border-radius:50%; animation:lgw-spin .8s linear infinite; margin:0 auto; }
.modal-spinner-wrap { text-align:center; padding:2rem 0 1.5rem; }
.modal-spinner-label { margin-top:.875rem; color:var(--text2); font-size:.875rem; font-family:var(--mono); }
.inline-spinner-wrap { display:flex; flex-direction:column; align-items:center; padding:.75rem 0; }
.inline-spinner { width:1.75rem; height:1.75rem; border:2.5px solid var(--border); border-top-color:var(--accent); border-radius:50%; animation:lgw-spin .8s linear infinite; }
.inline-spinner-label { margin-top:.5rem; color:var(--muted); font-size:.8rem; font-family:var(--mono); text-align:center; }
/* Tab bar */
.tab-bar { display:flex; gap:.5rem; margin-bottom:1rem; border-bottom:1px solid var(--border); }
.tab-bar-flush { display:flex; gap:0; border-bottom:1px solid var(--border); margin-bottom:1rem; }
/* Unread dot */
.unread-dot { color:var(--accent); font-size:.5rem; }
/* Action cell xs */
.action-cell-xs { vertical-align:middle; white-space:nowrap; }
.action-cell-xs > * + * { margin-left:.25rem; }
/* Error/info blocks */
.error-block { margin-bottom:1rem; padding:.5rem .75rem; background:rgba(255,0,0,.08); border-radius:6px; border:1px solid rgba(255,0,0,.15); }
.sync-detail { margin-bottom:1rem; border:1px solid var(--border); border-radius:6px; overflow:hidden; }
.sync-detail-header { padding:.5rem .75rem; background:var(--surface); border-bottom:1px solid var(--border); font-size:.85rem; }
/* Form group variants */
.form-group-sep { border-top:1px solid var(--border); padding-top:.75rem; margin-top:.5rem; }
.form-group-inset { margin-top:.75rem; padding:.5rem; background:var(--bg); border:1px solid var(--border); border-radius:4px; }
/* Spacing extras */
.p-3xl { padding:3rem; }
.min-w-0 { min-width:0; }
/* Link underline */
.link-underline { cursor:pointer; text-decoration:underline; text-underline-offset:2px; }
/* Chat list padding */
.chat-list-top { padding:0 .75rem .5rem; }
/* Inline message */
.msg-meta-block { background:var(--surface2); padding:.75rem; border-radius:6px; font-size:.85rem; white-space:pre-wrap; word-break:break-all; }
.label-check-sm { gap:.4rem; font-size:.8rem; cursor:pointer; user-select:none; }
.sync-info-banner { padding:.5rem; margin-bottom:.75rem; background:var(--accent); color:var(--bg); border-radius:4px; font-size:.8rem; }
.grid-sidebar { display:grid; grid-template-columns:1fr 2fr; gap:1.5rem; align-items:start; }
.icon-rel { position:relative; display:inline-block; line-height:1; }
.icon-badge-tl { position:absolute; top:-4px; right:-6px; font-size:.5rem; font-weight:bold; }
.icon-badge-tl-yellow { color:var(--yellow); }
.icon-badge-tl-red { color:var(--red); }
.icon-badge-tl-green { color:var(--green); }
.min-h-line { min-height:1.2em; }
.text-09 { font-size:.9rem; }
.text-875 { font-size:.875rem; }
/* Copy btn (log/explorer) */
.btn-copy-sm { font-size:.7rem; padding:.15rem .5rem; }
/* Inline explorer endpoint code */
.explorer-code { font-size:.8rem; color:var(--text); }
/* Tool result pre blocks */
.tool-result-pre { font-size:.7rem; margin:.2rem 0; white-space:pre-wrap; word-break:break-all; color:var(--text2); }
/* Image/media file previews */
.file-img-preview { max-width:300px; max-height:200px; border-radius:6px; margin-top:4px; cursor:pointer; }
.file-audio { max-width:100%; margin-top:4px; }
/* Misc */
.user-select-none { user-select:none; }
.word-break-all { word-break:break-all; }
.sticky-top { position:sticky; top:0; }
.max-h-scroll { max-height:300px; overflow-y:auto; }
.max-h-modal { max-height:70vh; overflow-y:auto; padding-right:.5rem; }
.min-h-textarea { min-height:120px; }
.min-h-textarea-sm { min-height:60px; }
.mt-35 { margin-top:.35rem; }
.mb-2 { margin-bottom:.2rem; }
.min-w-150 { min-width:150px; }
.min-w-200 { min-width:200px; }
.max-h-200 { max-height:200px; overflow-y:auto; }
.td-msg { font-size:.82rem; max-width:400px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.td-caps { white-space:normal; max-width:280px; }
.code-w80 { width:80px; }
.mt-75 { margin-top:.75rem; }
/* Explorer pre blocks */
.explorer-pre-resp { margin-top:.25rem; padding:.5rem; background:var(--bg); border:1px solid var(--border); font-family:'IBM Plex Mono',monospace; font-size:.7rem; overflow-x:auto; white-space:pre-wrap; }
.explorer-pre-run { margin-top:.5rem; padding:.75rem; background:var(--bg); border:1px solid var(--border); border-radius:4px; font-family:'IBM Plex Mono',monospace; font-size:.75rem; overflow-x:auto; max-height:400px; white-space:pre-wrap; }
.label-file-item { padding:.2rem 0; }
.label-file-item-lg { padding:.3rem 0; }
.text-78 { font-size:.78rem; }
/* Bug report description block */
.bug-desc-block { background:var(--bg); border:1px solid var(--border); padding:.75rem; font-size:.85rem; white-space:pre-wrap; max-height:200px; overflow-y:auto; }
/* Metadata table */
.meta-table { font-size:.8rem; }
.meta-td-label { padding:.35rem .75rem .35rem 0; }
.meta-td-value { padding:.35rem 0; word-break:break-all; }
/* Explorer */
.explorer-endpoint-border { border-top:1px solid var(--border); padding:.75rem 1rem; }
.explorer-method-badge { display:inline-block; width:60px; text-align:center; padding:.15rem .4rem; font-family:'IBM Plex Mono',monospace; font-size:.7rem; font-weight:700; color:#fff; border-radius:3px; }
.explorer-code { font-size:.8rem; color:var(--text); }
.explorer-ep-body { margin-top:.75rem; }
.code-param { width:80px; }
/* Sync log table */
.sync-table { font-size:.78rem; }
.sync-th-icon { width:2rem; }
.sync-td-email { font-size:.72rem; }
.sync-td-detail { font-size:.72rem; color:var(--muted); }
/* Specific padding helpers */
.px-sm-py-xs { padding:.25rem .75rem; }
.p-sm-lg { padding:.5rem .75rem; }
.p-sm-lg-t { padding:.5rem .75rem .25rem; }
/* Version label in sidebar */
.sidebar-section-header { padding:.5rem .75rem .25rem; letter-spacing:.1em; text-transform:uppercase; }
/* Mobile version bar */
.mobile-version-bar { padding:.25rem .75rem; border-bottom:1px solid var(--border); }
/* Tool card */
.tool-card-inner { padding:.75rem 1rem; margin-bottom:.75rem; }
/* Indexing filename */
.idx-filename { font-size:.8rem; font-family:var(--mono); padding-left:2rem; }
/* Progress labels with mono */
/* Tab buttons - active/inactive state (set via JS) */
.tab-btn-active { border-radius:0; border-bottom:2px solid var(--accent); }
.tab-btn-inactive { border-radius:0; border-bottom:2px solid transparent; }
/* Clickable count values in datatable cells */
.tbl-link { color:var(--accent); text-decoration:underline; cursor:pointer; font-family:'IBM Plex Mono',monospace; font-size:.8rem; }
.tbl-link:hover { opacity:.8; }
/* File type icon — excluded from text selection so double-click copies only filename */
.file-icon { user-select:none; margin-right:.3em; }
/* Conversion detail line in indexing modal — truncated with ellipsis if too long */
.idx-detail-label { font-size:.75rem; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%; text-align:center; margin-top:.2rem; }
/* Phase duration summary shown in the completed indexing modal */
.idx-timing-summary { margin-top:.6rem; font-size:.8rem; color:var(--text2); text-align:center; line-height:2; }
.idx-timing-summary .mono { font-family:'IBM Plex Mono',monospace; color:var(--accent); }
/* Stable minimum height for modals with filterable/dynamic content — prevents visual jumping */
.modal-content-stable { min-height: 360px; }
/* Login link */
.login-link { text-decoration:none; }
.td-sys-prompt { max-width:150px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.select-compact { padding:.4rem .6rem; }
/* Button padding variants */
.btn-pad-sm { padding:.3rem .5rem; }
.btn-pad-md { padding:.4rem .6rem; }
.log-error-msg { background:var(--surface2); padding:.75rem; border-radius:6px; font-size:.85rem; color:var(--red); }
.idx-error-detail { font-size:.75rem; color:var(--muted); font-family:var(--mono); word-break:break-all; background:var(--surface2); padding:.5rem; border-radius:4px; text-align:left; }
.flt-model-dd { min-width:180px; max-width:220px; flex-shrink:0; }
/* Chat container layout */
.chat-container-full { height:calc(100vh - 160px); margin:-2rem; margin-top:0; display:flex; flex-direction:column; }
.icon-nudge { display:inline-block; transform:translateY(-0.1em); }
/* Scrollable search list (ssl) — used in org members modal and file links modal */
.ssl-section-label { font-size:.65rem; font-family:'IBM Plex Mono',monospace; text-transform:uppercase; color:var(--muted); margin:.75rem 0 .25rem; }
.ssl-list { list-style:none; max-height:240px; overflow-y:auto; border:1px solid var(--border); border-radius:var(--radius); }
.ssl-item { padding:.5rem .75rem; border-bottom:1px solid var(--border); font-size:.85rem; }
.ssl-item:last-child { border-bottom:none; }
.ssl-item-actions { display:flex; align-items:center; justify-content:space-between; gap:.5rem; }