:root{--color-bg: #000000;--color-surface: #2d2d2d;--color-surface-2: #161616;--color-surface-3: #1f1f1f;--color-green: #2cff05;--color-purple: #bf00ff;--color-text: #ffffff;--color-text-secondary: #b7b7b7;--color-text-muted: #818181;--color-border: #3a3a3a;--color-border-strong: #555555;--color-danger: #ff3b47;--color-warning: #ffb020;--radius: 0px;--radius-2: 2px;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-8: 32px;--space-10: 40px;--space-12: 48px;--topbar-h: 52px;--sidebar-w: 320px;color-scheme:dark;font-family:Inter,IBM Plex Sans,system-ui,-apple-system,Segoe UI,sans-serif}*{box-sizing:border-box}html,body,#root{margin:0;height:100%;background:var(--color-bg);color:var(--color-text);font-size:15px;line-height:1.45;-webkit-font-smoothing:antialiased}button{font-family:inherit;cursor:pointer}input,textarea{font-family:inherit}h1,h2,h3,h4,p{margin:0}:focus-visible{outline:2px solid var(--color-green);outline-offset:1px}.btn{border:none;border-radius:var(--radius);padding:10px 16px;font-size:13px;font-weight:600;min-height:40px;letter-spacing:.2px;transition:background-color .12s ease,border-color .12s ease,opacity .12s ease,transform .12s ease}.btn:active{transform:translateY(1px)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--color-green);color:#000}.btn-primary:hover:not(:disabled){background:#54ff00}.btn-secondary{background:transparent;color:var(--color-text);border:1px solid var(--color-border-strong)}.btn-secondary:hover:not(:disabled){border-color:var(--color-green);color:var(--color-green)}.btn-danger{background:transparent;color:var(--color-danger);border:1px solid var(--color-danger)}.btn-danger:hover:not(:disabled){background:#ff3b471f}.btn-loading{display:inline-flex;align-items:center;gap:8px;justify-content:center}.icon-btn{background:transparent;border:1px solid transparent;color:var(--color-text-secondary);border-radius:var(--radius);min-width:40px;min-height:40px;padding:8px;font-size:16px;line-height:1;transition:color .12s,border-color .12s,background-color .12s}.icon-btn:hover{color:var(--color-text);border-color:var(--color-border-strong);background:var(--color-surface-2)}.field{margin-bottom:var(--space-4);text-align:left}.field-label{display:block;margin-bottom:var(--space-1);font-size:12px;font-weight:600;letter-spacing:.4px;text-transform:uppercase;color:var(--color-text-secondary)}.input{width:100%;background:var(--color-surface-2);color:var(--color-text);border:1px solid var(--color-border);border-radius:var(--radius);padding:11px 12px;font-size:14px;transition:border-color .12s}.input:focus{outline:none;border-color:var(--color-green);box-shadow:0 0 0 1px var(--color-green)}.input-error{border-color:var(--color-danger)}.field-hint{display:block;margin-top:4px;font-size:12px;color:var(--color-text-muted)}.field-error{display:block;margin-top:4px;font-size:12px;color:var(--color-danger)}.spinner{display:inline-grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:2px;animation:spin-square 1s steps(1) infinite}.spinner-bar{background:var(--color-border-strong)}@keyframes spin-square{0%{transform:rotate(0)}25%{transform:rotate(90deg)}50%{transform:rotate(180deg)}75%{transform:rotate(270deg)}to{transform:rotate(360deg)}}.spinner-xs{width:14px;height:14px}.spinner-sm{width:18px;height:18px}.spinner-md{width:26px;height:26px}.spinner-lg{width:40px;height:40px}.spinner .b1{background:var(--color-green)}.spinner .b2,.spinner .b3{background:var(--color-border-strong)}.spinner .b4{background:var(--color-purple)}.inline-loading{display:inline-flex;align-items:center;gap:10px;color:var(--color-text-secondary);font-size:13px}.inline-loading.centered{justify-content:center}.inline-loading-label{color:var(--color-text-secondary)}.skeleton{display:inline-block;background:linear-gradient(90deg,#2d2d2d,#393939,#2d2d2d);background-size:200% 100%;animation:shimmer 1.3s ease-in-out infinite;border-radius:var(--radius)}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.progress{height:4px;width:100%;background:var(--color-surface);border-radius:0;overflow:hidden}.progress-fill{height:100%;background:var(--color-green);transition:width .15s ease}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:var(--color-text-muted);padding:var(--space-8);gap:var(--space-2);min-height:200px}.empty-glyph{width:36px;height:36px;border:2px solid var(--color-border);position:relative}.empty-glyph:after{content:"";position:absolute;top:6px;right:6px;bottom:6px;left:6px;border:1px solid var(--color-purple);opacity:.7}.empty-state h3{font-size:15px;color:var(--color-text-secondary)}.empty-state p{font-size:13px;max-width:320px}.error-state{border:1px solid var(--color-danger);background:#ff3b4712;padding:var(--space-4);margin:var(--space-4) 0;color:var(--color-text-secondary);font-size:13px;display:flex;gap:var(--space-4);align-items:center;justify-content:space-between}.error-state .btn{min-width:90px}.pin-wrap{display:flex;justify-content:center;position:relative;margin-bottom:var(--space-4)}.pin-hidden{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;width:100%;height:100%;cursor:text;border:none;background:transparent}.pin-boxes{display:flex;gap:6px}.pin-box{width:42px;height:52px;display:grid;place-items:center;border:1px solid var(--color-border-strong);background:var(--color-surface-2);font-size:20px;color:var(--color-text)}.pin-box.filled{border-color:var(--color-green)}.pin-wrap.pin-error .pin-box,.pin-wrap.pin-error .pin-box.filled{border-color:var(--color-danger)}[data-tip]{position:relative}[data-tip]:hover:after{content:attr(data-tip);position:absolute;bottom:calc(100% + 6px);left:50%;transform:translate(-50%);background:var(--color-surface);border:1px solid var(--color-border);color:var(--color-text-secondary);font-size:11px;padding:4px 6px;white-space:nowrap;z-index:50;pointer-events:none}.boot-screen{height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-5);background:var(--color-bg)}.boot-logo{font-size:20px;font-weight:700;letter-spacing:4px;color:var(--color-text)}.boot-logo b{color:var(--color-green)}.auth-screen{height:100dvh;display:grid;place-items:center;padding:var(--space-5);background:var(--color-bg)}.auth-card{width:100%;max-width:380px;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);padding:var(--space-8)}.auth-brand{text-align:center;margin-bottom:var(--space-6)}.auth-brand h1{font-size:20px;letter-spacing:3px}.auth-brand h1 b{color:var(--color-green)}.auth-brand p{font-size:12px;color:var(--color-text-muted);margin-top:4px}.auth-form{display:flex;flex-direction:column;gap:var(--space-4)}.auth-form .btn{width:100%}.auth-switch{margin-top:var(--space-4);text-align:center;background:none;border:none;color:var(--color-text-muted);font-size:13px;padding:8px}.auth-switch:hover{color:var(--color-text);text-decoration:underline}.auth-error{margin-top:var(--space-3);border:1px solid var(--color-danger);color:var(--color-danger);background:#ff3b4712;padding:10px 12px;font-size:13px}.auth-ok{margin-top:var(--space-3);border:1px solid var(--color-green);color:var(--color-green);background:#2cff0512;padding:10px 12px;font-size:13px}.register-steps{display:flex;align-items:center;justify-content:center;gap:var(--space-2);margin-bottom:var(--space-6);flex-wrap:wrap}.rstep{border:1px solid var(--color-border);color:var(--color-text-muted);font-size:11px;padding:5px 8px;letter-spacing:.4px;white-space:nowrap}.rstep.active{border-color:var(--color-green);color:var(--color-green)}.rstep.done{border-color:var(--color-purple);color:var(--color-purple)}.rstep-arrow{color:var(--color-text-muted);font-size:12px}.lock-screen{height:100dvh;display:grid;place-items:center;background:var(--color-bg);padding:var(--space-5)}.lock-card{width:100%;max-width:340px;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);padding:var(--space-8);text-align:center}.lock-badge{margin:0 auto var(--space-4);width:46px;height:46px;border:2px solid var(--color-purple);display:grid;place-items:center;font-size:20px;color:var(--color-purple)}.lock-title{font-size:15px;letter-spacing:3px;color:var(--color-text)}.lock-subtitle{font-size:12px;color:var(--color-text-muted);margin:6px 0 var(--space-6)}.app{height:100dvh;display:flex;flex-direction:column;background:var(--color-bg)}.topbar{height:var(--topbar-h);display:flex;align-items:center;gap:var(--space-3);padding:0 var(--space-4);background:var(--color-surface);border-bottom:1px solid var(--color-border);flex-shrink:0}.topbar-brand{font-weight:700;letter-spacing:2px;font-size:16px}.topbar-brand b{color:var(--color-green);font-weight:800}.topbar-spacer{flex:1}.topbar-user{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--color-text-secondary)}.conn-dot{width:8px;height:8px;background:var(--color-border-strong)}.conn-dot.online{background:var(--color-green)}.conn-dot.away{background:var(--color-purple)}.home{flex:1;display:flex;min-height:0}.sidebar{width:var(--sidebar-w);border-right:1px solid var(--color-border);background:var(--color-bg);display:flex;flex-direction:column;flex-shrink:0}.sidebar-header{padding:var(--space-3);border-bottom:1px solid var(--color-border);display:flex;gap:var(--space-2);align-items:center}.search-input-wrap{flex:1;position:relative}.search-input{width:100%;background:var(--color-bg);border:1px solid var(--color-border);border-radius:0;padding:9px 32px;color:var(--color-text);font-size:13px}.search-input:focus,.search-input:focus-visible{outline:none;border-color:var(--color-green);box-shadow:0 0 0 1px var(--color-green)}.search-icon{position:absolute;left:9px;top:50%;transform:translateY(-50%);color:var(--color-text-muted);font-size:14px;pointer-events:none}.search-clear{position:absolute;right:4px;top:50%;transform:translateY(-50%)}.conv-list{flex:1;overflow-y:auto}.conv-list:empty{display:flex}.conv-row{display:flex;gap:var(--space-3);padding:var(--space-3);border-bottom:1px solid var(--color-border);border-left:2px solid transparent;cursor:pointer;align-items:center;transition:background-color .12s}.conv-row:hover{background:var(--color-surface-2)}.conv-row.selected{border-left-color:var(--color-green);background:var(--color-surface)}.conv-avatar{width:40px;height:40px;border:1px solid var(--color-border-strong);background:var(--color-surface-2);display:grid;place-items:center;font-weight:600;color:var(--color-text-secondary);flex-shrink:0}.conv-row.selected .conv-avatar{border-color:var(--color-green)}.conv-main{flex:1;min-width:0}.conv-name{font-size:14px;color:var(--color-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.conv-row.selected .conv-name{color:var(--color-green)}.conv-preview{font-size:12px;color:var(--color-text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}.conv-side{display:flex;flex-direction:column;align-items:flex-end;gap:4px;flex-shrink:0}.conv-time{font-size:11px;color:var(--color-text-muted)}.conv-unread{min-width:18px;height:18px;background:var(--color-purple);color:#000;font-size:11px;font-weight:700;display:grid;place-items:center;padding:0 4px}.conv-row-skel{pointer-events:none}.conv-row-skel .conv-main{display:flex;flex-direction:column;gap:8px;justify-content:center}.chat{flex:1;display:flex;flex-direction:column;min-width:0;background:var(--color-bg)}.chat-header{height:56px;display:flex;align-items:center;gap:var(--space-3);padding:0 var(--space-4);border-bottom:1px solid var(--color-border);background:var(--color-surface);flex-shrink:0}.chat-back{display:none}.chat-header-title{font-size:16px;font-weight:600}.chat-header-sub{font-size:11px;color:var(--color-text-muted);margin-top:1px}.chat-actions{margin-left:auto;display:flex;gap:4px}.enc-badge{display:flex;align-items:center;gap:6px;font-size:11px;color:var(--color-text-muted);border:1px solid var(--color-border);padding:4px 8px}.enc-badge .lock-ico{color:var(--color-green)}.timeline{flex:1;overflow-y:auto;padding:var(--space-4) var(--space-4) var(--space-2);display:flex;flex-direction:column;gap:var(--space-2)}.timeline-top{display:flex;justify-content:center;padding:var(--space-2) 0 var(--space-4)}.timeline-top:empty{display:none}.date-divider{display:flex;align-items:center;gap:var(--space-3);margin:var(--space-5) 0 var(--space-3);color:var(--color-text-muted);font-size:11px;letter-spacing:1px}.date-divider:before,.date-divider:after{content:"";flex:1;height:1px;background:var(--color-border)}.msg{display:flex;flex-direction:column;max-width:70%}.msg.own{align-self:flex-end;align-items:flex-end}.msg.incoming{align-self:flex-start;align-items:flex-start}.msg.group{max-width:70%}.msg-sender{font-size:11px;color:var(--color-purple);font-weight:600;margin-bottom:2px}.msg-panel{background:var(--color-surface-2);border:1px solid var(--color-border);border-radius:0;padding:10px 12px;position:relative}.msg.own .msg-panel{border-right:2px solid var(--color-green);background:var(--color-surface)}.msg.incoming .msg-panel{border-left:2px solid var(--color-purple);background:var(--color-surface-2)}.msg-text{font-size:14px;color:var(--color-text);white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.45}.msg-meta{display:flex;align-items:center;gap:6px;margin-top:4px}.msg-time{font-size:11px;color:var(--color-text-muted)}.msg-state{font-size:11px;display:inline-flex;align-items:center;gap:4px}.msg-state.sending,.msg-state.sent{color:var(--color-text-muted)}.msg-state.failed{color:var(--color-danger)}.msg-state.retrying{color:var(--color-purple)}.msg-state .spinner-xs{width:10px;height:10px}.msg-pending-typing{align-self:flex-start}.composer{border-top:1px solid var(--color-border);background:var(--color-surface);padding:var(--space-3) var(--space-4);flex-shrink:0}.composer-warn{border:1px solid var(--color-warning);color:var(--color-warning);background:#ffb02012;padding:8px 12px;font-size:12px;margin-bottom:var(--space-3)}.composer-row{display:flex;align-items:flex-end;gap:var(--space-2)}.composer-attach{flex-shrink:0}.composer-textarea{flex:1;background:var(--color-surface-2);border:1px solid var(--color-border);border-radius:0;color:var(--color-text);font-size:14px;padding:10px 12px;resize:none;min-height:40px;max-height:120px;line-height:1.4}.composer-textarea:focus,.composer-textarea:focus-visible{outline:none;border-color:var(--color-green);box-shadow:0 0 0 1px var(--color-green)}.composer-textarea:disabled{opacity:.5;cursor:not-allowed}.btn-send{background:var(--color-green);color:#000;border:none;border-radius:0;padding:10px 18px;font-size:13px;font-weight:700;min-height:40px}.btn-send:hover:not(:disabled){background:#54ff00}.btn-send:disabled{opacity:.5;cursor:not-allowed}.reconnect-bar{display:flex;align-items:center;gap:var(--space-2);padding:6px 12px;background:#bf00ff1a;border-bottom:1px solid var(--color-purple);color:var(--color-purple);font-size:12px}.render-fallback{height:100dvh;display:grid;place-items:center;background:var(--color-bg);padding:var(--space-5)}@media (max-width: 899px){:root{--sidebar-w: 100%}.sidebar{width:100%;border-right:none}.chat{display:none}.chat.mobile-open{display:flex;position:fixed;top:0;right:0;bottom:0;left:0;z-index:30;background:var(--color-bg)}.chat-back{display:inline-flex}.msg{max-width:85%}}@media (min-width: 900px){.home{flex-direction:row}.sidebar{width:var(--sidebar-w)}}*{scrollbar-width:thin;scrollbar-color:#3a3a3a transparent}*::-webkit-scrollbar{width:10px;height:10px}*::-webkit-scrollbar-thumb{background:#3a3a3a}*::-webkit-scrollbar-thumb:hover{background:#555}*::-webkit-scrollbar-track{background:transparent}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}