:root{--accent:#3b63ec;--accent-strong:#2c4fd8;--accent-soft:#e8eeff;--bg:#fff;--bg-app:#eef1f6;--bg-chat:#e9edf3;--bg-elev:#fff;--bg-hover:#f2f4f8;--bg-input:#f1f3f7;--text:#15181e;--text-muted:#6b7380;--border:#e2e6ec;--bubble-in:#fff;--bubble-out:#dce6ff;--bubble-out-text:#10204d;--danger:#e5484d;--success:#2fb36b;--warn:#e8a317;--read:#3b63ec;--shadow:0 6px 30px #0f141e1f;--radius:14px;--glass-border:#ffffffa6;--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}@media (prefers-color-scheme:dark){:root{--accent:#5b7fff;--accent-strong:#7391ff;--accent-soft:#1e2847;--bg:#161a21;--bg-app:#0f1115;--bg-chat:#0f1218;--bg-elev:#1c212a;--bg-hover:#222833;--bg-input:#222833;--text:#e8ebf0;--text-muted:#8c95a3;--border:#2a303b;--bubble-in:#1f2530;--bubble-out:#2c4290;--bubble-out-text:#f1f4ff;--read:#8fb0ff;--glass-border:#ffffff14;--shadow:0 6px 30px #00000080;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{color:var(--text);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;overscroll-behavior:none;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:15px;line-height:1.4}button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:none;padding:0}button:disabled{cursor:default;opacity:.5}a{color:var(--accent)}input,textarea{font:inherit;color:inherit}h1,h2,h3{margin:0}.muted{color:var(--text-muted)}.small{font-size:13px}.mono{word-break:break-all;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px}.btn{background:var(--bg-input);border-radius:10px;justify-content:center;align-items:center;gap:8px;padding:11px 18px;font-weight:500;transition:background .15s;display:inline-flex}.btn:hover:not(:disabled){background:var(--bg-hover)}.btn.primary{background:var(--accent);color:#fff}.btn.primary:hover:not(:disabled){background:var(--accent-strong)}.btn.ghost{background:0 0}.btn.danger{color:var(--danger)}.link-btn{color:var(--accent);margin-left:12px;font-weight:500}.link-btn.muted{color:inherit;opacity:.8}.icon-btn{width:40px;height:40px;color:var(--text-muted);border-radius:50%;flex:none;justify-content:center;align-items:center;text-decoration:none;transition:background .15s,color .15s;display:inline-flex}.icon-btn:hover:not(:disabled){background:var(--bg-hover);color:var(--text)}.icon-btn.small{width:28px;height:28px}.form{flex-direction:column;gap:14px;display:flex}.form label{color:var(--text-muted);flex-direction:column;gap:6px;font-size:13px;display:flex}.form input{border:1px solid var(--border);background:var(--bg-input);color:var(--text);border-radius:10px;outline:none;padding:11px 12px;font-size:16px}.form input:focus{border-color:var(--accent)}.form small{font-size:12px}.form-error{color:var(--danger);margin:0;font-size:14px}.form-hint{color:var(--text-muted);margin:0;font-size:14px}.splash{place-items:center;height:100%;display:grid}.auth{min-height:100%;padding:calc(24px + var(--safe-top)) 16px calc(24px + var(--safe-bottom));place-items:center;display:grid}.auth-card{background:var(--bg-elev);width:100%;max-width:400px;box-shadow:var(--shadow);border-radius:18px;flex-direction:column;gap:18px;padding:28px 24px;display:flex}.auth-card h1{font-size:22px}.auth-card p{margin:0}.auth-logo{align-items:center;gap:12px;font-size:24px;font-weight:700;display:flex}.auth-logo img{border-radius:14px}.auth-links{flex-wrap:wrap;justify-content:space-between;gap:8px;font-size:14px;display:flex}.banner{top:calc(8px + var(--safe-top));z-index:50;box-shadow:var(--shadow);background:var(--bg-elev);white-space:nowrap;border-radius:20px;padding:8px 16px;font-size:13px;position:fixed;left:50%;transform:translate(-50%)}.banner-offline{background:var(--danger);color:#fff}.banner-connecting{background:var(--warn);color:#1a1300}.banner-update{top:auto;bottom:calc(16px + var(--safe-bottom))}.layout{left:0;right:0;top:var(--app-top,0px);height:var(--app-height,100dvh);grid-template-rows:minmax(0,1fr);grid-template-columns:minmax(300px,380px) 1fr;display:grid;position:fixed;overflow:hidden}.detail{background:var(--bg-chat);flex-direction:column;min-width:0;height:100%;min-height:0;display:flex}@media (max-width:760px){.layout{grid-template-columns:1fr}.layout .detail,.layout.show-detail .sidebar{display:none}.layout.show-detail .detail{display:flex}}@media (min-width:761px){.icon-btn.back{display:none}}.placeholder{color:var(--text-muted);flex-direction:column;flex:1;justify-content:center;align-items:center;gap:12px;display:flex}.placeholder img{opacity:.6;border-radius:18px}.sidebar{background:var(--bg);border-right:1px solid var(--border);flex-direction:column;height:100%;min-height:0;display:flex}.sidebar-header{padding:calc(10px + var(--safe-top)) 12px 6px;align-items:center;gap:10px;display:flex}.sidebar-header h2{flex:1;font-size:20px}.search{background:var(--bg-input);color:var(--text-muted);border-radius:12px;align-items:center;gap:8px;margin:6px 12px 8px;padding:0 4px 0 12px;display:flex}.search input{min-width:0;color:var(--text);background:0 0;border:none;outline:none;flex:1;padding:10px 0;font-size:16px}.search input::-webkit-search-cancel-button{display:none}.conv-list{padding:0 6px calc(8px + var(--safe-bottom));flex:1;overflow-y:auto}.list-caption{text-transform:uppercase;letter-spacing:.04em;color:var(--text-muted);padding:8px 10px 4px;font-size:12px}.conv-row{width:100%;color:inherit;text-align:left;border-radius:12px;align-items:center;gap:12px;padding:8px 10px;text-decoration:none;display:flex}.conv-row:hover{background:var(--bg-hover)}.conv-row.active{background:var(--accent-soft)}.conv-main{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}.conv-top,.conv-bottom{align-items:center;gap:8px;display:flex}.conv-name{text-overflow:ellipsis;white-space:nowrap;flex:1;font-weight:600;overflow:hidden}.conv-time{color:var(--text-muted);align-items:center;gap:3px;font-size:12px;display:inline-flex}.conv-preview{color:var(--text-muted);text-overflow:ellipsis;white-space:nowrap;flex:1;font-size:14px;overflow:hidden}.badge{background:var(--accent);color:#fff;border-radius:11px;place-items:center;min-width:22px;height:22px;padding:0 7px;font-size:12px;font-weight:600;display:inline-grid}.empty{text-align:center;color:var(--text-muted);padding:24px 16px;font-size:14px}.empty.center{margin:auto}.avatar{color:#fff;background:var(--bg-input);-webkit-user-select:none;user-select:none;border-radius:50%;flex:none;place-items:center;font-weight:600;display:grid;overflow:hidden}.avatar img{object-fit:cover;width:100%;height:100%}.chat,.settings{flex-direction:column;flex:1;min-height:0;display:flex;position:relative}.chat-header{padding:calc(8px + var(--safe-top)) 8px 8px;background:var(--bg);border-bottom:1px solid var(--border);align-items:center;gap:6px;min-height:56px;display:flex}.chat-header h2{padding-left:4px;font-size:18px}.chat-peer{text-align:left;border-radius:10px;align-items:center;gap:10px;min-width:0;padding:2px 6px;display:flex}.chat-peer:hover{background:var(--bg-hover)}.chat-peer-text{flex-direction:column;min-width:0;display:flex}.chat-peer-name{text-overflow:ellipsis;white-space:nowrap;font-weight:600;overflow:hidden}.chat-peer-sub{color:var(--text-muted);font-size:12px}.spacer{flex:1}.messages{-webkit-overflow-scrolling:touch;overscroll-behavior:contain;overflow-anchor:none;flex:1;min-height:0;position:relative;overflow:hidden auto}.messages-content{padding:12px 12px calc(var(--composer-h,64px) + 6px);flex-direction:column;gap:3px;display:flex}.jump-bottom{right:14px;bottom:calc(var(--composer-h,64px) + 10px);background:var(--bg-elev);width:42px;height:42px;color:var(--text-muted);box-shadow:var(--shadow);z-index:4;border-radius:50%;place-items:center;display:grid;position:absolute}.loading-older{text-align:center;color:var(--text-muted);padding:6px;font-size:13px}.day-sep{z-index:1;justify-content:center;margin:10px 0 6px;display:flex;position:sticky;top:0}.day-sep span{background:color-mix(in srgb, var(--bg-elev) 85%, transparent);color:var(--text-muted);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:12px;padding:3px 10px;font-size:12px}.msg-row{flex-direction:column;max-width:min(78%,560px);display:flex}.msg-row.mine{align-self:flex-end;align-items:flex-end}.msg-row.theirs{align-self:flex-start;align-items:flex-start}.bubble{background:var(--bubble-in);overflow-wrap:anywhere;border-radius:16px;min-width:70px;padding:7px 10px 6px;position:relative;box-shadow:0 1px 1px #0000000d}.mine .bubble{background:var(--bubble-out);color:var(--bubble-out-text);border-bottom-right-radius:6px}.theirs .bubble{border-bottom-left-radius:6px}.bubble.failed{outline:1px solid var(--danger)}.bubble.has-media{padding:4px 4px 6px}.bubble.has-media .text{padding:4px 6px 0}.text{white-space:pre-wrap;display:inline}.text a{color:inherit;text-decoration:underline}.meta{float:right;opacity:.65;align-items:center;gap:3px;margin:6px 0 -2px 10px;font-size:11px;line-height:1;display:inline-flex}.bubble.has-media .meta{margin-right:6px}.status{display:inline-flex}.status-read{color:var(--read);opacity:1}.status-failed{color:var(--danger)}.msg-actions{align-items:center;gap:2px;margin-top:2px;font-size:12px;display:flex}.msg-error{color:var(--danger);margin-right:4px}.attachments{flex-direction:column;gap:4px;display:flex}.media-thumb{border-radius:12px;max-width:100%;display:block;position:relative;overflow:hidden}.media-thumb img.sized{aspect-ratio:var(--ar);width:min(360px, 66vw, calc(360px * var(--ar)));min-width:0;height:auto;min-height:0}.media-thumb img{object-fit:cover;background:var(--bg-input);min-width:120px;max-width:min(360px,66vw);min-height:80px;max-height:360px;display:block}.media-video{border-radius:12px;position:relative;overflow:hidden}.media-video video{background:#000;max-width:min(400px,66vw);max-height:360px;display:block}.media-download{color:#fff;background:#00000080;border-radius:50%;place-items:center;width:30px;height:30px;display:grid;position:absolute;top:6px;right:6px}.pending img,.pending video{opacity:.7}.progress{background:#ffffff80;border-radius:2px;height:4px;position:absolute;bottom:8px;left:8px;right:8px;overflow:hidden}.file-card+.progress,div>.progress:only-child{background:var(--border);margin:4px 6px;position:static}.progress div{background:var(--accent);height:100%;transition:width .2s}.file-card{color:inherit;border-radius:12px;align-items:center;gap:10px;min-width:200px;max-width:320px;padding:6px 10px 6px 6px;text-decoration:none;display:flex}a.file-card:hover{background:#7f7f7f1f}.file-icon{background:var(--accent);color:#fff;border-radius:50%;flex:none;place-items:center;width:42px;height:42px;display:grid}.file-info{flex-direction:column;flex:1;min-width:0;display:flex}.file-name{text-overflow:ellipsis;white-space:nowrap;font-weight:500;overflow:hidden}.file-size{opacity:.7;font-size:12px}.call-entry{justify-content:center;margin:6px 0;display:flex}.call-pill{background:var(--bg-elev);color:var(--text-muted);border-radius:14px;align-items:center;gap:6px;padding:5px 12px;font-size:13px;display:inline-flex}.call-pill.missed{color:var(--danger)}.call-time{opacity:.7;margin-left:4px;font-size:11px}.composer-wrap{z-index:3;padding:6px 10px calc(10px + var(--safe-bottom));pointer-events:none;position:absolute;bottom:0;left:0;right:0}.composer-wrap>*{pointer-events:auto}.glass{background:color-mix(in srgb, var(--bg-elev) 72%, transparent);-webkit-backdrop-filter:blur(18px)saturate(1.6);backdrop-filter:blur(18px)saturate(1.6);border:1px solid var(--glass-border);box-shadow:0 2px 14px #0f141e1a}.composer{align-items:flex-end;gap:8px;display:flex}.round-btn{width:46px;height:46px;color:var(--text);border-radius:50%;flex:none;place-items:center;transition:transform .1s,background .15s;display:grid}.round-btn:active{transform:scale(.94)}.round-btn.send{background:var(--accent);color:#fff;box-shadow:0 2px 12px color-mix(in srgb, var(--accent) 45%, transparent)}.round-btn.danger-icon{color:var(--danger)}.input-pill{border-radius:23px;flex:1;align-items:center;min-width:0;min-height:46px;padding:0 16px;display:flex}.input-pill textarea{resize:none;width:100%;max-height:160px;color:var(--text);background:0 0;border:none;outline:none;flex:1;padding:11px 0;font-size:16px;line-height:1.35}.input-pill textarea::placeholder{color:var(--text-muted)}.input-pill.recording{font-variant-numeric:tabular-nums;gap:10px}.rec-dot{background:var(--danger);border-radius:50%;width:10px;height:10px;animation:1s ease-in-out infinite rec}@keyframes rec{50%{opacity:.25}}.rec-label{color:var(--text-muted)}.rec-time{font-variant-numeric:tabular-nums;min-width:62px}.input-pill.recording.holding{padding-right:56px;overflow:hidden}.rec-hint{color:var(--text-muted);white-space:nowrap;margin-left:auto;transition:opacity .1s}.mic-slot{flex:none;width:46px;height:46px;position:relative}.round-btn.mic{z-index:2;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;width:46px;height:46px;transition:width .18s,height .18s,right .18s,bottom .18s,background .18s,color .18s;position:absolute;bottom:0;right:0}.round-btn.mic.holding{background:var(--accent);color:#fff;width:92px;height:92px;box-shadow:0 0 0 calc(6px + var(--level,0) * 26px) color-mix(in srgb, var(--accent) 22%, transparent);border:none;transition:width .18s,height .18s,right .18s,bottom .18s,box-shadow 80ms linear;bottom:-23px;right:-23px}.round-btn.mic.holding:active{transform:none}.rec-lock{width:46px;height:84px;color:var(--text-muted);border-radius:23px;flex-direction:column;justify-content:center;align-items:center;gap:6px;animation:.18s rise;display:flex;position:absolute;bottom:84px;right:0}@keyframes rise{0%{opacity:0;translate:0 16px}}.composer-notice{color:var(--danger);border-radius:14px;justify-content:space-between;align-items:center;gap:8px;margin:0 4px 8px;padding:6px 6px 6px 14px;font-size:13px;display:flex}.voice{align-items:center;gap:10px;width:min(260px,62vw);padding:2px 2px 0;display:flex}.voice-btn{background:var(--accent);color:#fff;border-radius:50%;flex:none;place-items:center;width:40px;height:40px;display:grid}.voice-body{flex-direction:column;flex:1;gap:6px;min-width:0;display:flex}.voice-track{background:color-mix(in srgb, var(--text-muted) 35%, transparent);cursor:pointer;touch-action:none;border-radius:2px;height:4px;position:relative}.voice-track:before{content:"";position:absolute;top:-10px;bottom:-10px;left:0;right:0}.voice-fill{background:var(--accent);border-radius:2px;height:100%}.voice-time{opacity:.7;font-variant-numeric:tabular-nums;font-size:12px}.drop-overlay{border:2px dashed var(--accent);background:color-mix(in srgb, var(--bg) 85%, transparent);color:var(--accent);pointer-events:none;z-index:5;border-radius:16px;place-items:center;font-weight:600;display:grid;position:absolute;top:8px;bottom:8px;left:8px;right:8px}.lightbox{height:var(--app-height,100dvh);z-index:60;background:#000000eb;flex-direction:column;display:flex;position:fixed;top:0;bottom:auto;left:0;right:0}.lightbox-bar{padding:calc(8px + var(--safe-top)) 8px 8px 16px;color:#fff;align-items:center;gap:4px;display:flex}.lightbox-bar span{text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.lightbox-bar .icon-btn{color:#fff}.lightbox img{object-fit:contain;width:100%;min-height:0;padding-bottom:var(--safe-bottom);flex:1}.modal-backdrop{z-index:40;background:#00000073;place-items:center;padding:16px;display:grid;position:fixed;top:0;bottom:0;left:0;right:0}.modal{background:var(--bg-elev);width:100%;max-width:380px;box-shadow:var(--shadow);border-radius:18px;padding:28px 20px 20px;position:relative}.modal-close{position:absolute;top:8px;right:8px}.profile{text-align:center;flex-direction:column;align-items:center;gap:6px;display:flex}.profile h2{margin-top:10px}.profile p{margin:0}.user-id{color:var(--text-muted);word-break:break-all;margin-top:4px;font-size:12px}.profile-actions{flex-wrap:wrap;justify-content:center;gap:8px;margin-top:16px;display:flex}.settings-body{padding:20px 16px calc(24px + var(--safe-bottom));flex-direction:column;flex:1;gap:20px;width:100%;max-width:560px;margin:0 auto;display:flex;overflow-y:auto}.settings-profile{flex-direction:column;align-items:center;gap:12px;display:flex}.row-gap{gap:8px;display:flex}.settings-info{background:var(--bg-elev);border-radius:var(--radius);grid-template-columns:max-content 1fr;gap:8px 16px;margin:0;padding:14px 16px;display:grid}.settings-info dt{color:var(--text-muted)}.settings-info dd{overflow-wrap:anywhere;min-width:0;margin:0}.settings-section{background:var(--bg-elev);border-radius:var(--radius);flex-direction:column;align-items:flex-start;gap:8px;padding:14px 16px;display:flex}.settings-section h3{font-size:16px}.settings-section p{margin:0}.call-overlay{height:var(--app-height,100dvh);z-index:70;color:#fff;padding:calc(48px + var(--safe-top)) 16px calc(32px + var(--safe-bottom));background:radial-gradient(circle at 50% 30%,#2a3a74,#0d1226 70%);flex-direction:column;justify-content:space-between;align-items:center;display:flex;position:fixed;top:0;bottom:auto;left:0;right:0}.call-overlay.with-video{background:#000}.call-peer{flex-direction:column;align-items:center;gap:16px;margin-top:6vh;display:flex}.call-peer h2{font-size:26px;font-weight:600}.call-status{z-index:2;text-align:center;opacity:.9;text-shadow:0 1px 3px #00000080;font-size:16px;position:relative}.with-video .call-status{top:calc(16px + var(--safe-top));position:absolute;left:0;right:0}.call-status .warn{color:#ffd27a}.call-notice{color:#ffd27a;margin-top:6px;font-size:13px}.remote-video{object-fit:contain;background:#000;width:100%;height:100%;position:absolute;top:0;bottom:0;left:0;right:0}@media (max-width:760px){.remote-video{object-fit:cover}}.local-video{right:16px;bottom:calc(120px + var(--safe-bottom));aspect-ratio:3/4;object-fit:cover;z-index:3;background:#111;border-radius:14px;width:min(28vw,180px);position:absolute;transform:scaleX(-1);box-shadow:0 4px 20px #00000080}.local-video.preview{width:min(40vw,240px)}.call-controls{z-index:4;justify-content:center;gap:18px;margin-top:auto;display:flex;position:relative}.call-btn{color:#fff;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#ffffff2e;border-radius:50%;place-items:center;width:62px;height:62px;transition:transform .1s,background .15s;display:grid}.call-btn:active{transform:scale(.94)}.call-btn.off{color:#111;background:#fff}.call-btn.reject{background:var(--danger)}.call-btn.accept{background:var(--success);animation:1.4s infinite pulse}@keyframes pulse{0%,to{box-shadow:0 0 #2fb36b99}50%{box-shadow:0 0 0 14px #2fb36b00}}@media (prefers-reduced-motion:reduce){.call-btn.accept,.rec-dot,.rec-lock{animation:none}}.settings-section.form{align-items:stretch}.settings-section.form .btn{align-self:flex-start}.push-prompt{background:var(--accent-soft);border-radius:12px;align-items:center;gap:8px;margin:4px 12px 6px;padding:10px 8px 10px 12px;font-size:13px;display:flex}.push-prompt-text{flex:1;min-width:0}.btn.small-btn{flex:none;padding:7px 12px;font-size:13px}:root.keyboard-open,:root.ios-short-viewport{--safe-bottom:0px}html{background:var(--bg-app)}html:has(.layout){background:var(--bg)}html:has(.layout.show-detail){background:var(--bg-chat)}@media (min-width:761px){html:has(.layout){background:var(--bg-chat)}}html:has(.call-overlay){background:#0d1226}html:has(.call-overlay.with-video){background:#000}html:has(.lightbox){background:#000}