:root{--bg:#0f1419;--bg-2:#1a222b;--bg-3:#22303c;--border:#2c3a47;--text:#e6edf3;--text-dim:#8b9bb0;--accent:#25d366;--accent-dim:#128c4b;--warn:#f0a020;--danger:#e5534b;--radius:10px}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Arial,sans-serif;min-height:100vh}.hidden{display:none!important}.topbar{background:var(--bg-2);border-bottom:1px solid var(--border);padding:14px 24px}.topbar-inner{max-width:1200px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.topbar h1{font-size:20px}.topbar-right{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.server-status{color:var(--text-dim);font-size:13px}.server-status.ok{color:var(--accent)}.server-status.bad{color:var(--danger)}#btnKey.has-key,.btn-key.has-key{color:var(--accent);border-color:var(--accent-dim)}.layout{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:300px 1fr;grid-gap:20px;gap:20px;padding:20px 24px}.sidebar{background:var(--bg-2);border:1px solid var(--border);border-radius:var(--radius);padding:16px;height:-moz-fit-content;height:fit-content}.sidebar-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.sidebar-head h2{font-size:15px}.session-list{list-style:none}.session-list li{padding:10px 12px;border-radius:8px;cursor:pointer;display:flex;align-items:center;gap:10px;font-size:14px}.session-list li:hover{background:var(--bg-3)}.session-list li.active{background:var(--bg-3);outline:1px solid var(--accent-dim)}.session-list li.empty{cursor:default;color:var(--text-dim)}.dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}.dot.connected{background:var(--accent)}.dot.connecting,.dot.waiting_for_qr{background:var(--warn)}.dot.disconnected,.dot.error,.dot.logged_out{background:var(--danger)}.session-name{flex:1 1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.panel{background:var(--bg-2);border:1px solid var(--border);border-radius:var(--radius);padding:20px;min-height:400px}.empty-state{color:var(--text-dim);text-align:center;padding:80px 0}.session-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:16px;flex-wrap:wrap}.session-head h2{font-size:18px;word-break:break-all}.meta{color:var(--text-dim);font-size:13px}.session-actions{display:flex;gap:8px;flex-wrap:wrap}.card{background:var(--bg-3);border:1px solid var(--border);border-radius:var(--radius);padding:16px;margin-bottom:16px}.card h3{font-size:14px;margin-bottom:10px}.card-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.card-head h3{margin-bottom:0}.status-row{display:flex;align-items:center;gap:12px}.status-badge{display:inline-block;padding:4px 12px;border-radius:999px;font-size:13px;font-weight:600;background:var(--bg-2);border:1px solid var(--border)}.status-badge.connected{color:var(--accent);border-color:var(--accent-dim)}.status-badge.connecting,.status-badge.waiting_for_qr{color:var(--warn);border-color:var(--warn)}.status-badge.disconnected,.status-badge.error,.status-badge.logged_out{color:var(--danger);border-color:var(--danger)}.qr-card{text-align:center}.qr-card img{width:220px;height:220px;background:#fff;border-radius:8px;padding:10px;margin:10px 0}.send-form{display:flex;flex-direction:column;gap:12px}.form-grid{display:grid;grid-template-columns:1fr 1fr;grid-gap:12px;gap:12px}label{display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--text-dim)}input,select{background:var(--bg);border:1px solid var(--border);color:var(--text);border-radius:8px;padding:9px 12px;font-size:14px;outline:none}input:focus,select:focus{border-color:var(--accent-dim)}.btn{background:var(--bg);border:1px solid var(--border);color:var(--text);padding:9px 16px;border-radius:8px;cursor:pointer;font-size:14px;transition:opacity .15s}.btn:hover{opacity:.85}.btn-active{background:var(--accent-dim);border-color:var(--accent-dim);color:#fff}.btn-sm{padding:6px 12px;font-size:13px}.btn-primary{background:var(--accent-dim);border-color:var(--accent-dim);color:#fff}.btn-warn{color:var(--warn);border-color:var(--warn)}.btn-danger{color:var(--danger);border-color:var(--danger)}.btn:disabled{opacity:.5;cursor:not-allowed}.msg-list{list-style:none;max-height:320px;overflow-y:auto;display:flex;flex-direction:column;gap:8px}.msg-list li{background:var(--bg);border:1px solid var(--border);border-radius:8px;padding:10px 12px;font-size:13px}.msg-list li.empty{color:var(--text-dim);background:transparent;border:none}.msg-edited{color:var(--text-dim);font-size:11px;margin-left:6px}.msg-item{display:flex;flex-direction:column;gap:4px}.msg-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.msg-dir{font-weight:600}.msg-dir.in{color:var(--accent)}.msg-dir.out,.msg-jid{color:var(--text-dim)}.msg-type{background:var(--bg-3);padding:2px 8px;border-radius:999px;font-size:11px}.msg-body{word-break:break-word}.msg-actions{margin-top:4px}.msg-actions .btn{padding:3px 10px;font-size:12px}.new-key-box{background:var(--bg-3);border:1px solid var(--accent);border-radius:8px;padding:10px 12px;margin-top:10px;display:flex;flex-direction:column;gap:8px;font-size:13px}.new-key-row{display:flex;align-items:center;gap:8px}.new-key-value{word-break:break-all;font-size:12px}.login-body{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:20px}.login-card{background:var(--bg-2);border:1px solid var(--border);border-radius:var(--radius);padding:32px;width:380px;max-width:92vw;display:flex;flex-direction:column;gap:14px;text-align:center}.login-card h1{font-size:20px}.login-form{display:flex;flex-direction:column;gap:12px;text-align:left}.login-error{color:#ffb3ae}.modal-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.6);display:flex;align-items:center;justify-content:center;z-index:60}.modal{background:var(--bg-2);border:1px solid var(--border);border-radius:var(--radius);padding:24px;width:380px;max-width:92vw;display:flex;flex-direction:column;gap:12px}.modal-wide{width:560px}.modal-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}.modal h3{font-size:16px}.modal code{background:var(--bg);padding:2px 6px;border-radius:4px;font-size:12px}.modal-actions{display:flex;justify-content:flex-end;gap:8px}.login-session-list{list-style:none;max-height:320px;overflow-y:auto;display:flex;flex-direction:column;gap:8px}.login-session-list li{background:var(--bg);border:1px solid var(--border);border-radius:8px;padding:10px 12px;display:flex;align-items:center;gap:10px;font-size:13px}.login-session-list li.empty{color:var(--text-dim);background:transparent;border:none;justify-content:center}.login-session-info{flex:1 1;display:flex;flex-direction:column;gap:2px;min-width:0}.login-session-device{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.login-session-meta{color:var(--text-dim);font-size:12px}.badge-current{background:var(--accent-dim);color:#fff;padding:2px 8px;border-radius:999px;font-size:11px;white-space:nowrap}.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(80px);background:var(--bg-3);border:1px solid var(--border);color:var(--text);padding:12px 20px;border-radius:8px;font-size:14px;transition:transform .25s;z-index:50;max-width:90vw}.toast.show{transform:translateX(-50%) translateY(0)}.toast.error{border-color:var(--danger);color:#ffb3ae}.toast.success{border-color:var(--accent-dim)}@media (max-width:800px){.form-grid,.layout{grid-template-columns:1fr}}.docs-layout{grid-template-columns:1fr}.docs{background:var(--bg-2);border:1px solid var(--border);border-radius:var(--radius);padding:28px 32px;line-height:1.65;font-size:14.5px;overflow-wrap:break-word}.docs h1,.docs h2,.docs h3,.docs h4{color:var(--text);margin:1.4em 0 .6em;line-height:1.3}.docs h1{font-size:26px;padding-bottom:.4em}.docs h1,.docs h2{border-bottom:1px solid var(--border)}.docs h2{font-size:21px;padding-bottom:.3em}.docs h3{font-size:17px}.docs h4{font-size:15px}.docs h1:first-child,.docs h2:first-child{margin-top:0}.docs p{margin:.7em 0}.docs a{color:var(--accent);text-decoration:none}.docs a:hover{text-decoration:underline}.docs ol,.docs ul{margin:.7em 0;padding-left:1.6em}.docs li{margin:.3em 0}.docs li>ol,.docs li>ul{margin:.2em 0}.docs hr{border:none;border-top:1px solid var(--border);margin:2em 0}.docs blockquote{border-left:3px solid var(--accent-dim);background:var(--bg-3);margin:1em 0;padding:.6em 1em;border-radius:0 var(--radius) var(--radius) 0;color:var(--text-dim)}.docs blockquote p{margin:.3em 0}.docs code{background:var(--bg-3);border:1px solid var(--border);border-radius:5px;padding:.15em .4em;font-family:ui-monospace,SFMono-Regular,Consolas,Liberation Mono,monospace;font-size:.9em}.docs pre{background:#0b0e12;border:1px solid var(--border);border-radius:var(--radius);padding:14px 16px;overflow-x:auto;margin:1em 0;line-height:1.5}.docs pre code{background:none;border:none;padding:0;font-size:13px}.docs table{border-collapse:collapse;margin:1em 0;width:100%;display:block;overflow-x:auto;font-size:13.5px}.docs td,.docs th{border:1px solid var(--border);padding:8px 12px;text-align:left}.docs th{background:var(--bg-3);color:var(--text);font-weight:600}.docs tr:nth-child(2n) td{background:rgba(255,255,255,.02)}.docs strong{color:var(--text)}.docs img{max-width:100%}