:root{--bg: #0a1013;--bg-elevated: #101a1e;--surface: #142026;--surface-hover: #1a292f;--border: #22343b;--border-strong: #2f4750;--text: #dde8ea;--text-muted: #7d949c;--text-faint: #55686f;--accent: #2ee6a8;--accent-dim: #1c8c68;--danger: #ff6b6b;--danger-dim: #7a2f2f;--warn: #f5b942;--info: #63b3ed;--radius: 8px;--mono: ui-monospace, "SF Mono", "JetBrains Mono", "Fira Code", Menlo, Consolas, monospace;--sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", sans-serif}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--sans);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased}a{color:var(--accent)}code,kbd,pre,.mono{font-family:var(--mono);font-size:.92em}.shell{display:grid;grid-template-columns:232px 1fr;height:100%}.sidebar{background:var(--bg-elevated);border-right:1px solid var(--border);display:flex;flex-direction:column;padding:20px 14px;gap:4px;overflow-y:auto}.brand{display:flex;align-items:baseline;gap:8px;padding:0 8px 18px}.brand-mark{font-family:var(--mono);font-weight:700;font-size:16px;letter-spacing:-.5px;color:var(--accent)}.brand-sub{font-size:11px;color:var(--text-faint);text-transform:uppercase;letter-spacing:1px}.nav-item{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 10px;border-radius:6px;border:none;background:transparent;color:var(--text-muted);font-family:inherit;font-size:13.5px;text-align:left;cursor:pointer;transition:background .12s,color .12s}.nav-item:hover{background:var(--surface);color:var(--text)}.nav-item.active{background:var(--surface);color:var(--accent);box-shadow:inset 2px 0 0 var(--accent)}.sidebar-footer{margin-top:auto;padding-top:16px;border-top:1px solid var(--border);font-size:12px;color:var(--text-faint);display:flex;flex-direction:column;gap:8px}.main{overflow-y:auto;padding:28px 32px 64px}.page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:22px}h1{font-size:20px;margin:0 0 4px;letter-spacing:-.3px}h2{font-size:15px;margin:0 0 10px;letter-spacing:-.2px}.page-sub{color:var(--text-muted);font-size:13px;margin:0;max-width:68ch}.card{background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius);padding:18px}.grid{display:grid;gap:14px}.grid.cols-2{grid-template-columns:repeat(auto-fill,minmax(340px,1fr))}.row{display:flex;align-items:center;gap:10px}.row.wrap{flex-wrap:wrap}.spacer{flex:1}button{font-family:inherit}.btn{border:1px solid var(--border-strong);background:var(--surface);color:var(--text);border-radius:6px;padding:7px 13px;font-size:13px;cursor:pointer;transition:background .12s,border-color .12s,opacity .12s;white-space:nowrap}.btn:hover:not(:disabled){background:var(--surface-hover);border-color:var(--accent-dim)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn.primary{background:var(--accent-dim);border-color:var(--accent-dim);color:#04140e;font-weight:600}.btn.primary:hover:not(:disabled){background:var(--accent);border-color:var(--accent)}.btn.danger{border-color:var(--danger-dim);color:var(--danger)}.btn.danger:hover:not(:disabled){background:#2a1616;border-color:var(--danger)}.btn.small{padding:4px 9px;font-size:12px}.btn.ghost{background:transparent;border-color:transparent;color:var(--text-muted)}.btn.ghost:hover:not(:disabled){color:var(--text);background:var(--surface)}input,select,textarea{background:var(--bg);border:1px solid var(--border-strong);border-radius:6px;color:var(--text);padding:8px 10px;font-family:inherit;font-size:13px;width:100%}input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent-dim);box-shadow:0 0 0 2px #2ee6a81f}textarea{resize:vertical;min-height:72px}label{display:block;font-size:12px;color:var(--text-muted);margin-bottom:5px}.field{margin-bottom:14px}.field-hint{font-size:11.5px;color:var(--text-faint);margin-top:4px}.checkbox{display:flex;align-items:flex-start;gap:8px;font-size:13px;color:var(--text);margin-bottom:6px;cursor:pointer}.checkbox input{width:auto;margin-top:3px;accent-color:var(--accent)}.checkbox .checkbox-label{display:block;margin:0;color:var(--text);font-size:13px}.checkbox .checkbox-desc{display:block;color:var(--text-faint);font-size:11.5px}table{width:100%;border-collapse:collapse;font-size:13px}th{text-align:left;color:var(--text-faint);font-weight:500;font-size:11px;text-transform:uppercase;letter-spacing:.6px;padding:0 12px 8px;border-bottom:1px solid var(--border)}td{padding:10px 12px;border-bottom:1px solid var(--border);vertical-align:middle}tbody tr:hover{background:var(--bg-elevated)}.table-wrap{overflow-x:auto}.badge{display:inline-flex;align-items:center;gap:5px;padding:2px 8px;border-radius:999px;font-size:11.5px;border:1px solid var(--border-strong);color:var(--text-muted);white-space:nowrap}.badge .dot{width:6px;height:6px;border-radius:50%;background:currentColor}.badge.connected{color:var(--accent);border-color:var(--accent-dim)}.badge.connecting,.badge.qr{color:var(--warn);border-color:#6b5216}.badge.error,.badge.logged-out{color:var(--danger);border-color:var(--danger-dim)}.badge.denied{color:var(--warn);border-color:#6b5216}.badge.ok{color:var(--accent);border-color:var(--accent-dim)}.badge.role-admin{color:var(--info);border-color:#2b4a63}.tag{display:inline-block;padding:1px 6px;border-radius:4px;background:var(--surface);border:1px solid var(--border);font-family:var(--mono);font-size:11px;color:var(--text-muted);margin:1px 3px 1px 0}.alert{border-radius:6px;padding:10px 12px;font-size:13px;margin-bottom:14px;border:1px solid}.alert.error{background:#241515;border-color:var(--danger-dim);color:#ffb0b0}.alert.success{background:#0f2620;border-color:var(--accent-dim);color:#97f2d2}.alert.warn{background:#2a2214;border-color:#6b5216;color:#f6d693}.alert.info{background:#10222e;border-color:#2b4a63;color:#a9d5f5}.empty{color:var(--text-faint);font-size:13px;padding:26px 0;text-align:center}.modal-backdrop{position:fixed;inset:0;background:#04080ab8;display:flex;align-items:flex-start;justify-content:center;padding:60px 20px;z-index:50;overflow-y:auto}.modal{background:var(--bg-elevated);border:1px solid var(--border-strong);border-radius:10px;width:100%;max-width:520px;padding:22px;box-shadow:0 24px 64px #0000008c}.modal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.modal-head h2{margin:0}.login-wrap{height:100%;display:flex;align-items:center;justify-content:center;padding:24px}.login-card{width:100%;max-width:380px}.login-card .brand{padding-bottom:22px}.session-card{display:flex;flex-direction:column;gap:12px}.session-card .head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.session-name{font-size:15px;font-weight:600;letter-spacing:-.2px}.session-meta{font-family:var(--mono);font-size:12px;color:var(--text-muted)}.qr-box{background:#fff;border-radius:8px;padding:10px;align-self:center;line-height:0}.qr-box img{width:220px;height:220px;display:block}.chat-layout{display:grid;grid-template-columns:280px 1fr;gap:14px;height:calc(100vh - 190px);min-height:420px}.chat-list{border:1px solid var(--border);border-radius:var(--radius);background:var(--bg-elevated);overflow-y:auto}.chat-item{display:block;width:100%;text-align:left;border:none;background:transparent;color:var(--text);padding:10px 12px;border-bottom:1px solid var(--border);cursor:pointer;font-family:inherit}.chat-item:hover{background:var(--surface)}.chat-item.active{background:var(--surface);box-shadow:inset 2px 0 0 var(--accent)}.chat-item .title{font-size:13px;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chat-item .preview{font-size:11.5px;color:var(--text-faint);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.message-pane{border:1px solid var(--border);border-radius:var(--radius);background:var(--bg-elevated);display:flex;flex-direction:column;overflow:hidden}.message-scroll{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:8px}.bubble{max-width:72%;padding:8px 11px;border-radius:10px;background:var(--surface);border:1px solid var(--border);font-size:13px;white-space:pre-wrap;word-break:break-word}.bubble.mine{align-self:flex-end;background:#133328;border-color:var(--accent-dim)}.bubble .meta{font-size:10.5px;color:var(--text-faint);margin-top:4px;font-family:var(--mono)}.composer{border-top:1px solid var(--border);padding:10px;display:flex;gap:8px;align-items:flex-end}.composer textarea{min-height:40px;max-height:140px}.token-box{background:var(--bg);border:1px solid var(--accent-dim);border-radius:6px;padding:12px;font-family:var(--mono);font-size:12.5px;word-break:break-all;color:var(--accent);margin-bottom:10px}pre.snippet{background:var(--bg);border:1px solid var(--border);border-radius:6px;padding:12px;overflow-x:auto;font-size:12px;color:var(--text-muted);margin:0 0 12px}.detail-cell{max-width:380px;font-family:var(--mono);font-size:11.5px;color:var(--text-faint);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}